首页 >

基于jQuery实现Div窗口震动特效代码-代码简单【jquery】

web前端|js教程基于jQuery实现Div窗口震动特效代码-代码简单【jquery】
jquery实现div窗口,jq实现窗口震动
web前端-js教程
这是一款jQuery窗口震动效果代码,在Div边框内点击一下鼠标,它就开始震动了,适用浏览器:IE8、360、FireFox、Chrome、Opera、傲游、搜狗、世界之窗等。
visual源码测试,苹果系统搭建 ubuntu,python 搜索后爬虫,php嵌套php页面中,seo软件渠道lzw
效果图如下:
苹果cms整站源码,vscode中怎么隐藏大纲,ubuntu php 卸载,更改tomcat启动名称,农村黑爬虫,sae部署php,seo网络推广价格行情,手机网站上传图片代码,DISCUZ论坛系统模板lzw
360导航首页源码,vscode火焰编码特效,ubuntu刷内核,用户执行tomcat权限,爬虫症,php 图片批量上传插件,seo竞价托管价格排名,网站源码在哪里找,右侧网站导航模板lzw
代码如下:

    jquery窗口震动特效   ;(function($){ var element = {}; $.fn.jshaker = function(){ element = $(this); element.css(position, relative); element.find(*).each(function(i, el){ $(el).css(position, relative); }); var iFunc = function(){ $.fn.jshaker.animate($(element)); }; setTimeout(iFunc, 50); }; $.fn.jshaker.animate = function(el){ $.fn.jshaker.shake(el); el.find(*).each(function(i, el){ $.fn.jshaker.shake(el); }); var iFunc = function(){ $.fn.jshaker.animate(el); }; setTimeout(iFunc, 50); } $.fn.jshaker.shake = function(el){ var pos = $(el).position(); if(Math.random() > 0.5){ $(el).css(top, pos[top] + Math.random() * 20 < 10 ? (Math.random() * 20 * (-1)) : Math.random() * 20); } else { $(el).css(left, pos[left] + Math.random() * 20 < 10 ? (Math.random() * 20 * (-1)) : Math.random() * 20); } } })(jQuery);   $(document).ready(function(){ $(.block).click(function(){ $(this).jshaker(); }); });   BODY{font-family: "Lucida Grande", Arial, Helvetica, sans-serif;color: #666666;font-size: 12px;background: #FFFFFF;} A{color: #0A8ECC;} A: HOVER{text-decoration: none;color: #8FCB2F;} H1{font-weight: normal;color: #0A8ECC;margin: 0;padding: 0;} BODY{margin: 20px;padding: 20px;} STRONG{color: #000000;} .vspacer{height: 20px;} PRE.code{padding: 7px;background: #777777;color: #F0F0F0;width: 400px;overflow: auto;} #content-area{border: 3px solid #CCCCCC;background: #F0F0F0;padding: 10px;width: 500px;} P.script-link{clear: both;padding: 10px 0;border-top: 1px dotted #CCCCCC;} #content .block {float: left;border: 1px solid #CCCCCC;background: #F0F0F0;padding: 10px;margin: 10px;width: 300px;}    

jquery窗 口 震 动 特 效

点击本框内,可实现震动

Item 1 Item 2 Item 3 Sub Item 1 Sub Item 2 Sub Item 3 Sub Item 4 Sub Item 5 Item 4 Item 5

以上代码很简单吧,基于jquery实现div窗口震动的特效就制作出来了,小伙伴们赶紧下载使用吧。


  • 暂无相关文章