首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 软件管理 > 软件开发 >

jquery向下滚动

2012-12-29 
jquery向上滚动script typetext/javascript srcjquery.js/scriptstyle typetext/css.messa

jquery向上滚动
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
   .messagewrap{height:50px}
</style>
<script>
  $(function(){
     msgmove();
   $("ul").hover(function(){
  $(this).attr("name","hovered"); //鼠标经过设置ul的name值为"hovered"
 },function(){
 $(this).removeAttr("name");
 });
 });
 function msgmove(){
  var isIE=!!window.ActiveXObject;
  var isIE6=isIE&&!window.XMLHttpRequest;
if($("ul").attr("name") != "hovered"){
//判断ul的name属性是否为"hovered",决定下面代码块是否运行,以实现鼠标经过暂停滚动。
var height = $("li:last").height();
if(isIE6){
//判断IE6,jQuery的animate动画和opacity透明在一起使用在IE6中会出现中文重影现象,
//所以在ie6中实行透明的禁用。
$("li:last").css({"height":0});
}else{ $("li:last").css({"opacity":0,"height":0});
//列表最后的li透明和高度设置为0 }
$("li:first").before($("li:last"));
//把列表最后的li提升到顶部,实现有限列表项无限循环滚动显示
$("li:first").animate({"height":height},300);
//列表顶部的li高度逐渐变高以把下面的li推下去 if(!isIE6){
$("li:first").animate({"opacity":"1"},300);
//在非IE6浏览器中设置透明淡入效果
}
}
setTimeout("msgmove()",1000);
//设置5秒滚动一次
}
</script>

</head>


<body>
<div class="messagewrap">
<ul>
<li>aaaaaaaaaaaaaa</li>
<li>aaaaaaaaaaaaaa</li>
<li>aaaaaaaaaaaaaa</li>
<li>aaaaaaaaaaaaaa</li>
<li>aaaaaaaaaaaaaa</li>
</ul>
</div>
</body>
</html>
这是向下滚动的,我怎么改都不向上滚,哪位大师知道啊
[解决办法]
发错版块了。要转换思维有点费事。

主要修改点应该是:

$("li:first").before($("li:last"));
改成:
$("li:last").after($("li:first"));

其它的,如
//var height = $("li:last").height();
var height = $("li:first").height();

//$("li:last").css({"height":0});
$("li:first").css({"height":height});

//}else{ $("li:last").css({"opacity":0,"height":0});
}else{ $("li:first").css({"opacity":0,"height":0});

//$("li:first").animate({"height":height},300);
$("li:last").animate({"height":height},300);

//$("li:first").animate({"opacity":"1"},300);
$("li:last").animate({"opacity":"1"},300);

等哪些是必要的,哪些是不必要的,或者按你的显示需求还需要怎么改改的,就自己试试吧。

热点排行