动态div上下效果!

1.首先导入JQ

当ul里的li被滑过的时候 ,li里的子div 和 p标签,更改自己本身的样式底部 = 0px

$("ul>li").mouseenter(function() {

$(this).children("div,p").css({

"bottom":"0px"

});

})

当ul里的li被滑开的时候 ,li里的子div 和 p标签,更改自己本身的样式底部 = -25px

$("ul>li").mouseleave(function() {

$(this).children("div,p").css({

"bottom":"-25px"

});

})

JQ最基础的运用!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. tab列表折叠效果 html: 能源系统事业部 岗位名称: 工作地点 岗位名...
    lilyping阅读 1,891评论 0 1
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1 92
  • jQuery基础 什么是JQ?一个优秀的JS库,大型开发必备JQ的好处?一简化JS的复杂操作二不再需要关心兼容性三...
    幺七阅读 955评论 0 2
  • 不会用代码框,所以看着有些乱套,,,,html部分 <!DOCTYPE html> 迅雷看看 ...
    这就是个帅气的名字阅读 1,560评论 0 0
  • 每一天忙的不可开交,时间自然过的飞快。自从知道成长的重要,学习的重要,已经不知不觉的每天保持晚上10点到12点,2...
    益阳仿古砖批发秦武阅读 288评论 0 0