Question

我有这个HTML，

+----+-------+------+------+
| ID | C     | X_ID | B_ID |
+----+-------+------+------+
| 1  | Alpha | 10   | 100  |
+----+-------+------+------+
| 2  | Alpha | 20   | 200  |
+----+-------+------+------+
| 3  | Alpha | 30   | 300  |
+----+-------+------+------+
| 4  | Beta  | 50   | 50   |
+----+-------+------+------+

我试图让它在点击时更改另一个div的位置。要实现这一点，我正在使用

<h2 class="more-button">Read More</h2>

FIDDLE： https://jsfiddle.net/wfxxkk3x/

但代码绝对没有。我已经尝试了许多不同的方法解决这个问题，似乎没有任何工作。任何帮助将不胜感激。

Answer 1

你的代码一切都很好..在你的js小提琴https://jsfiddle.net/wfxxkk3x/。 您将“隐藏块”作为ID而不是类。

所以只需将jquery选择器更改为“＃”hash。

示例：

    $(".more-button").click(function(){

//hidden-block is an id
    $("#hidden-block").css("right", "110%");

});

希望这会有所帮助

Answer 2

将hidden-block的选择器从类更改为id

$(".more-button").click(function(){
$("#hidden-block").css("right", "110%");});

https://jsfiddle.net/wfxxkk3x/5/

或使用animate来动画div

https://jsfiddle.net/cjon7apg/

Answer 3

您在<div class="hidden-block"></div>上设置了什么CSS？因为如果您没有在任何地方设置定位，那么"right", "110%"将无效。

尝试在position: absolute;上设置position: relative;或.hidden-block，这样可以让您移动块。

如果您没有样式表，并且想要使用纯jQuery，那么就像这样：

$(".more-button").click(function(){
  $(".hidden-block").css({"position":"relative", "right":"110%"});
});

Answer 4

您需要声明div的position，以使其受right

的影响

position: relative;

或

position: absolute;

Answer 5

在你的小提琴中，我注意到＆＃34; hidden-block＆＃34; ID不是CSS，所以你的javascript必须是：

$("#hidden-block").css("right", "110%");

然后，你是否包含jQuery？在你的小提琴中，我没有注意到外部资源中的jQuery库。

改变之后。＃，并添加jQuery，您的代码正常工作。尝试将110％更改为另一个值并查看结果。

更改css属性时Jquery .click无法正常工作

5 个答案: