function megaHoverOver(){
$(this).find(".sub").stop().fadeTo('fast', 1).show();
//Calculate width of all ul's
(function($) {
jQuery.fn.calcSubWidth = function() {
rowWidth = 0;
//Calculate row
$(this).find("ul").each(function() {
rowWidth += $(this).width();
});
};
})(jQuery);
如题,这个是一个下拉菜单的脚本,它通过查找UL个数来给下拉列表赋予宽度,比如宽度是200如果是4个UL就会是800的宽度平行展示,但是我想把那个UL两个两个的放在div中垂直罗列,也就是需要400的宽度,但是上面的代码还是出现了800的宽度,(this).find("div")也没有达成我的效果,请问各位能不能帮我解答呢,小弟对这段代码不熟,只能知道大概,如何能根据我的div数量给他400的宽度呢?谢谢大家啦!!!
$(this).find(".sub").stop().fadeTo('fast', 1).show();
//Calculate width of all ul's
(function($) {
jQuery.fn.calcSubWidth = function() {
rowWidth = 0;
//Calculate row
$(this).find("ul").each(function() {
rowWidth += $(this).width();
});
};
})(jQuery);
如题,这个是一个下拉菜单的脚本,它通过查找UL个数来给下拉列表赋予宽度,比如宽度是200如果是4个UL就会是800的宽度平行展示,但是我想把那个UL两个两个的放在div中垂直罗列,也就是需要400的宽度,但是上面的代码还是出现了800的宽度,(this).find("div")也没有达成我的效果,请问各位能不能帮我解答呢,小弟对这段代码不熟,只能知道大概,如何能根据我的div数量给他400的宽度呢?谢谢大家啦!!!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html"; charset=utf-8">
<title>Insert title here</title>
<script src="jquery.js"></script>
<style>
ul{
width: 200px;
list-style: none;
margin: 5px 0;
}
.ul-container{
float: left;
}
</style>
</head>
<body>
<div id="test">
<ul>
<li>11</li>
<li>12</li>
</ul>
<ul>
<li>21</li>
<li>22</li>
</ul>
<ul>
<li>31</li>
<li>32</li>
</ul>
<ul>
<li>41</li>
<li>42</li>
</ul>
</div>
<script>
(function($) {
jQuery.fn.extend({
calcSubWidth: function() {
var elem = $(this), div = null, rowWidth = 0;
//Calculate row
elem.find("ul").each(function(i) {
if(i%2 === 0){
div = $('<div class=ul-container>').appendTo(elem);
rowWidth = 0;
}
div.append(this);
rowWidth += $(this).width();
div.width(rowWidth);
});
}
});
})(jQuery);
$('#test').calcSubWidth();
</script>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html"; charset=utf-8">
<title>Insert title here</title>
<script src="jquery.js"></script>
<style>
ul{
width: 200px;
list-style: none;
margin: 5px 0;
}
.ul-group{
float: left;
}
</style>
</head>
<body>
<div id="test">
<ul>
<li>11</li>
<li>12</li>
</ul>
<ul>
<li>21</li>
<li>22</li>
</ul>
<ul>
<li>31</li>
<li>32</li>
</ul>
<ul>
<li>41</li>
<li>42</li>
</ul>
</div>
<script>
(function($) {
jQuery.fn.extend({
calcSubWidth: function() {
var elem = $(this), div = null, rowWidth = 0;
//Calculate row
elem.find("ul").each(function(i) {
if(i%2 === 0){
div = $('<div class=ul-group>').appendTo(elem);
rowWidth = 0;
}
div.append(this);
});
}
});
})(jQuery);
$('#test').calcSubWidth();
</script>
</body>
</html>