js之上翻隐藏

原创 2015年07月10日 16:41:52

$(".upturn").hover(function(){
    $(this).find("div:first").animate({"margin-top":"-48px"},200);
  },function(){
    $(this).find("div:first").animate({"margin-top":"0"},200);

  });



 .one-quick-menu{width:100%; height: 60px;  margin-top: 20px; position: relative; overflow: hidden;}
 .one-quick-menu ul li{float:left;}
 .one-quick-menu ul .content{width:150px; padding-left: 85px; padding-top: 8px;}
 .one-quick-menu ul .content h2{color:#de1d31;font-size: 14px;}
 .one-quick-menu ul .content h2 span{font-size: 18px;}
 .one-quick-menu ul .content .upturn-toggle{margin-top: 10px;}


<div class="one-quick-menu bg-white mt20">
<ul>
<li class="content upturn">
<div class="quick-price">
<h2><span>快速</span>上传</h2>
<p>海量曝光</p>
</div>
<div class="upturn-toggle">
<p>批量上传</p>
<p>让企业曝光度几何级增长</p>
</div>
</li>
<li class="line">/</li>
<li class="content upturn">
<div class="up-price">
<h2><span>快速</span>上传</h2>
<p>海量曝光</p>
</div>
<div class="upturn-toggle">
<p>批量上传</p>
<p>让企业曝光度几何级增长</p>
</div>
</li>
</ul>
</div>

相关文章推荐

菜鸟学JS(一)——上传图片之上传前预览图片

上传图片对图片进行一下预览,可以了解图片上传后大概会是什么样子,此功能用js实现,然后在fileupload控件的change事件中调用,这样当用fileupload选择完图片以后,图片就会自动显示出...

菜鸟学JS(二)——上传图片之上传后查看大图

将图片查询出来之后,还需要加一个查看大图的功能,于是就用js写了一个方法,然后在image的onmouseover事件中调用此方法,这样在鼠标悬浮在小图上面的时候,其大图就会自动的显示出来。 显示...

JS之上下左右不间断滚动

JS之上下左右不间断滚动

arm之上的threadx OS编程之总结

一:threadx 开场白 由于工作的原因,涉及到了threadx操作系统,其实我个人觉得,threadx和ucosII十分的相识,只是threadx用于商业性质,而不像ucosII那样提供了源代码...

第90讲:基于Scala的Actor之上的分布式并发消息驱动框架Akka初体验学习笔记

第90讲:基于Scala的Actor之上的分布式并发消息驱动框架Akka初体验学习笔记 akka在业界使用非常广泛 spark背后就是由akka驱动的 要写消息驱动的编程模型都首推akka 下...
  • slq1023
  • slq1023
  • 2015年08月20日 21:01
  • 866

android开发之上下拉刷新加载

  • 2015年10月26日 12:54
  • 1.43MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:js之上翻隐藏
举报原因:
原因补充:

(最多只允许输入30个字)