本文介绍了希望在模糊 div 上建立悬停/合同扩展的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!
问题描述
Hey all, I've been beating my head against the search engine walls for a couple hours now and figure I might as well just ask...
I need to build a div that is one size on blur, say 300x30, that expands to 300x300 on hover and pushes all content below it down and will revert to the 300x30 size when blurred ("no longer hovered" or whatever you kids are calling it now-a-days lol) again. Can someone point me to some resources or even give me some code bits to play with? It'd be much appreciated!
解决方案
You can use Psuedo-classes in CSS if you don't want an animation.
div.div {
height: 30px;
width: 300px;
border: 1px solid black;
}
div.div:hover {
height: 300px;
}
Live Example
http://jsfiddle.net/aFUmS/
$('.div').hover(function() {
$(this).animate({
height: '300px'
}, 300);
},function() {
$(this).animate({
height: '30px'
}, 300);
});
jQuery example if you want animation
http://jsfiddle.net/CvhkM/
这篇关于希望在模糊 div 上建立悬停/合同扩展的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!