2015-04-03 88 views
1

通过使用jquery,我想从顶部切割一个方形高度。它似乎默认情况下是从底层开始的。我该如何改变它?从顶部更改div的高度

这里有一个小提琴:http://jsfiddle.net/b4wcspy1/

<style> 
.square { 
height:100px; 
width: 100px; 
background:black; 
position:absolute; 

} 
</style> 
<body> 
<div class="square"></div> 
<script> 
$('div').click(function(){ 
$(this).css('height','60px')}) 
</script> 
</body> 
</html> 
+0

所以更改边距顶部 $(本)的.css你可以得到更多的信息( '的margin-top', '40像素'); – Banik 2015-04-03 10:25:14

回答

2

这里是JS:

$('div').click(function(){ 
     $init = $(this).height(); 
     $slice = 60; 
     $(this).css({'height':$slice+'px', 
        'margin-top':$init-$slice +'px' 
        }) 

    }) 

https://jsfiddle.net/9n29ex0o/1/

+0

当我再次点击它时,代码出现错误 – 2015-04-03 11:39:16

+0

$ init变量已更改,边距将等于0 – madalinivascu 2015-04-03 11:41:34

0

我已经做到了这一点,请在JS使用下面的代码

$('div').click(function(){ 
      $(this).css({"height":"60px","margin-top":"40px"}) 
}); 
0

试试这个:

<style> 
.square { 
height:100px; 
width: 100px; 
background:black; 
position:absolute; 

} 
</style> 
<body> 
<div class="square"></div> 
<script> 
$('div').click(function(){ 
$(this).height("60");}) 
</script> 
</body> 
</html> 



**$(this).height("60");** 

这是jQuery的函数。 从here