六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 132|回复: 0

关于用jQuery实现效果

[复制链接]

升级  52.67%

35

主题

35

主题

35

主题

秀才

Rank: 2

积分
129
 楼主| 发表于 2013-2-7 23:45:55 | 显示全部楼层 |阅读模式
1、效果1:关于新闻信息文字上下切换
<div  id="scrollNews">  <ul>  <li><span class="plin">July 12,2009 4:30 pm</span>AR Update: Rolling Stones concert canceled for July 22 in Los Angeles.  </li>  <li><span class="plin">July 12,2009 4:30 pm</span>AR Update: Rolling Stones concert canceled for July 22 in Los Angeles.  </li>  </ul>  </div>
/*AR new*/$(function(){        var $this = $("#scrollNews");var scrollTimer;$this.hover(function(){  clearInterval(scrollTimer); },function(){   scrollTimer = setInterval(function(){ scrollNews( $this );}, 3000 );}).trigger("mouseleave");});function scrollNews(obj){   var $self = obj.find("ul:first");   var lineHeight = $self.find("li:first").height(); //获取行高   $self.animate({ "marginTop" : -lineHeight +"px" }, 600 , function(){         $self.css({marginTop:0}).find("li:first").appendTo($self); //appendTo能直接移动元素   })}

2、效果2:将模块展开和关闭
/*模块展开和关闭*/$(function(){ $(".module_up_down").toggle(function(){var $self = $(this);$self.prev().slideToggle(600,function(){  $("img",$self).attr("src","images/up.gif");}); },function(){var $self = $(this);$self.prev().slideToggle(600,function(){  $("img",$self).attr("src","images/down.gif");}); })})
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表