富贵资源网 Design By www.hznty.com
scroll滚动插件
支持上下左右，淡入淡出，滚动时间设置，动画时间设置，鼠标经过是否停止设置
默认配置参数可修改
$(".content").easysroll({ //默认配置参数 direction: "left", //滚动方向 left（向左）right（向右） top(向上) bottom(向下) 默认left numberr: "1", //每一次滚动数量 默认是1 delays:"1000",//完成一次动画所需时间 默认是1000等于1秒 scrolling: "1000",//每一次动画的时间间隔 默认是1000等于1秒 fadein:false,//是否支持淡入或淡出 默认false enterStop:true //鼠标移入是否暂停滚动 默认是true })
html代码：
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>滚动插件（支持上下左右，淡入淡出，滚动时间设置，动画时间设置，鼠标经过是否停止设置）</title> <script src="/UploadFiles/2021-04-02/jquery-1.7.2.min.js">JS核心代码
(function ($) { $.fn.easysroll= function(options) { var parameter= { direction: "left", numberr: "1", delays:"1000", scrolling: "1000", fadein: false, enterStop:true }; var ops = $.extend(parameter,options); var $this=$(this); var _this=this; var _time=null; var obj=_this.find("[type='box']"); var items=obj.find("li"); var itemsleg=items.length; var itemsW=items.outerWidth(true); var itemsH=items.outerHeight(true); var _direction=ops.direction; var _numberr =ops.numberr; var _delays=ops.delays; var _scrolling =ops.scrolling; var _fadein=ops.fadein; var _enterStop=ops.enterStop; if(_direction=="top" || _direction=="bottom") { items.css({"float":"none"}); obj.width(itemsW*itemsleg); if(_direction=="bottom") { obj.css("margin-top",-_numberr*itemsH); } }else if(_direction=="left" || _direction=="right"){ items.css({"float":"left"}); obj.width(itemsW*itemsleg); if(_direction=="right") { obj.css("margin-left",-_numberr*itemsW); } }else{ alert("您配置的滚动方向有误，请重新配置"); return true; } function scroll(){ if(_direction=="left"){ obj.animate({"margin-left":-_numberr*itemsW},Number(_delays),function(){ for (var i=0;i<_numberr;i++){ obj.find("li").eq(0).appendTo(obj); } obj.css({"margin-left":0}) if(_fadein){ obj.find("li").eq(0).animate({"opacity":0},Number(_delays)); obj.find("li").eq(itemsleg-1).css({"opacity":1}); } }); }else if(_direction=="right"){ obj.animate({"margin-left":0},Number(_delays),function(){ for(var i=0;i<_numberr;i++){ obj.find("li").eq(itemsleg-1).prependTo(obj); }; obj.css("margin-left",-_numberr*itemsW); if(_fadein){ obj.find("li").eq(0).animate({"opacity":1},Number(_delays)); obj.find("li").eq(itemsleg-1).css({"opacity":0}); } }); }else if(_direction=="top"){ obj.animate({"margin-top":-_numberr*itemsH},Number(_delays),function(){ for (var i=0;i<_numberr;i++){ obj.find("li").eq(0).appendTo(obj); } obj.css({"margin-top":0}); if(_fadein){ obj.find("li").eq(0).animate({"opacity":0},Number(_delays)); obj.find("li").eq(itemsleg-1).css({"opacity":1}); } }); }else if(_direction=="bottom"){ obj.animate({"margin-top":0},Number(_delays),function(){ for(var i=0;i<_numberr;i++){ obj.find("li").eq(itemsleg-1).prependTo(obj); } obj.css("margin-top",-_numberr*itemsH); if(_fadein){ obj.find("li").eq(0).animate({"opacity":1},Number(_delays)); obj.find("li").eq(itemsleg-1).css({"opacity":0}); } }); } } $this.hover(function(){ if(_enterStop){ clearInterval(_time); } },function(){ _time= setInterval(scroll,_scrolling); }).trigger('mouseleave'); } })(jQuery);以上所述就是本文的全部内容了，希望大家能够喜欢。
富贵资源网 Design By www.hznty.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
富贵资源网 Design By www.hznty.com
暂无评论...
P70系列延期，华为新旗舰将在下月发布
3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。
而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。