123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307 |
- //----------------------------------------此js用来做特殊效果,例如弹出窗体缓动效果,关闭窗体缓动效果等-----------------------------
- Namespace.register("U.ME"); //js特效库
- //----到时全部都要合在Extend里
- //--------------------------------------------------------------------------动画区域---------------------------------------------------------------
- //动画
- U.ME.DH = function (UDOD, UTM, UTF, UDTD) {
- if (UDOD) {
- var i; //定义变量i
- var _UDE = UTM ? setInterval(U.M.apply(UDOD, [[U.ME.DHGDAMXG, [UTF, 0]]]), UTM) : null; //动画效果
- UDOD.onmouseout = UDOD.onmouseover = U.M.apply(UDOD, [[U.ME.DHGDAM, [arguments, _UDE]]]); //停止开始动画
- if (UDTD) {//功能未知,变量没试用过 一直为空 不会进if
- for (i = 0; i < UDTD.length; i++) {
- (UDTD[i]) && (UDTD[i].onclick = U.M.apply(UDTD[i], [[U.ME.DHQH, [i, arguments, _UDE]]])); //上下页切换
- };
- };
- }
- }
- //快速切换
- U.ME.DHQH = function (ITF, UAE, UDE) {
- clearInterval(UDE); //停止动画
- U.ME.DHGDAMXG.apply(UAE[0], [UAE[2], ITF]); //切换效果展示
- U.ME.DH.apply(window, UAE); //设置动画
- }
- //滚动动画开始停止
- U.ME.DHGDAM = function (USC, UDE) {
- if (!U.M.onmouseout(this)) { //取消动画
- var _UTP = event.type; //获取事件类型
- clearInterval(UDE); //关闭计时器
- if (_UTP == "mouseout") {//鼠标离开的时候
- U.ME.DH.apply(window, USC); //重新滚动
- }
- }
- }
- //动画效果
- U.ME.DHGDAMXG = function (UTF, ITF) {
- UTF = UTF == "L" ? "width" : "height"; //判断是不是L 是就改变宽度
- var _UFT = ITF === 0, //判断是否存在计时器
- _UDOD = $(this), //获取ul
- _UDAD = _UDOD.Child(), //获取ul下面的子元素
- _UDSD = _UDAD[_UFT ? 0 : _UDAD.length - 1],
- _UWH = "client" + (UTF.charAt(0).toUpperCase() + UTF.substr(1)),
- _UTP = [{ "overflow": "hidden" }, {}]; //设置样式
- if (_UDSD[_UWH]) { //这里是判断是否是否符合变化
- _UTP[0][UTF] = "0px"; _UTP[1][UTF] = _UDSD[_UWH] + "px"; //改变样式
- (_UFT) && (_UTP.reverse());
- $(_UDSD).addAttrArray({ "style": _UTP[0] }).animate(_UTP[1], 500, _UFT ? U.M.apply(null, [[U.M.apply(_UDOD, [[_UDOD.append, [_UDSD, 0]]])], [U.M.apply($(_UDSD), [[$(_UDSD).addAttrArray, [{ "style": _UTP[0]}]]])]]) : null); //执行动画?
- (!_UFT) && (this.insertBefore(_UDSD, _UDAD[0])); //插入元素
- }
- }
- //----------------------------------------------------------------------------切换图片------------------------------------------------------------
- //切换图片效果
- U.ME.YHT = function (UDOD, UDTD, UCL, ITF, UAT, ITM, UTF) {
- if (UDOD) {//变量是否定义
- var i, _UDCD = $(UDTD).Child(), //获取圆点的子元素
- _UDE = [], //初始化
- _UKE = [ITF || 0], //0?
- _UTM = null; //计时器
- if (ITM > 0) {
- _UTM = setInterval(U.M.apply(null, [[U.ME.YHTXZ, [UDOD, UDTD, _UKE, UCL]]]), ITM || 1000); //开始计时器 并且赋值
- } //图片选择
- _UKE[1] = _UTM; //存储计时器?
- if (!UTF) {//如果没值
- U.ME.YHTXZ(UDOD, UDTD, _UKE, UCL);
- } else if (_UKE[0] >= _UDCD.length) {//超过图片数量时
- _UKE[0] = 0; //?换成第一张
- };
- UTF = null; //参数变化
- UDOD.onmouseover = UDOD.onmouseout = U.M.apply(UDOD, [[U.M.StopBubble], [U.ME.YHTQX, [arguments, _UTM, _UKE]]]); //切换停止
- for (i = 0; i < _UDCD.length; i++) {
- _UDCD[i].onmouseover = _UDCD[i].onmouseout = U.M.apply(_UDCD[i], [[U.M.StopBubble], [U.ME.YHTQX, [arguments, _UTM, _UKE, i]]]); //切换查看
- }
- if (UAT) {//UAT 一直为0 不进入
- for (i = 0; i < 2; i++) {
- (UAT[i]) && (UAT[i].onclick = U.M.apply(UAT[i], [[U.ME.SXYHT, [(i - 1) * 2, _UKE, _UTM, arguments]]])); //上下页
- }
- }
- return _UTM; //返回计时器
- }
- }
- //计时器变化区域
- U.ME.YHTXZ = function (UDOD, UDTD, UDE, UCL) {
- var _UDAD = $(UDOD).Child();
- if ((!UDOD || UDOD) == (document || !_UDAD)) {
- clearInterval(UDE[1]); //移除
- }
- else {
- U.ME.ZSYHTXZ(UDOD, UDTD, UDE, UCL);
- UDE[0]++; (UDE[0] >= _UDAD.length) && (UDE[0] = 0); //变化切换
- }
- }
- //上下张
- U.ME.SXYHT = function (UTF, ITF, UTM, UCS) {
- var _UDCD = $(UCS[0]).Child();
- clearInterval(UTM); UCS[3] = (ITF[0] += UTF); //删除计时器
- if (ITF[0] < 0) {
- UCS[3] = _UDCD.length + UCS[3];
- }
- else if (ITF[0] >= _UDCD.length) {
- UCS[3] = 0;
- }
- U.ME.YHT.apply(this, UCS); //上下张查看
- }
- //开始或者取消图片选择查看
- U.ME.YHTQX = function (UCS, UTM, UKE, ITF) {
- if (!U.M.onmouseout(this)) {//是否在图片上取消
- var _UTP = event.type, //事件类型
- i = UKE[0] - 1;
- clearInterval(UTM); //关闭计时器
- i = i < 0 ? $(UCS[0]).Child().length - 1 : i;
- UCS[3] = UKE[0] = ITF != null ? ITF : UKE[0]; //清除计时器
- if (_UTP == "mouseout") {//鼠标离开
- UCS[3] = ITF != null ? ITF : i;
- UCS = Array.prototype.slice.call(UCS);
- UCS[6] = true; UCS[3]++;
- U.ME.YHT.apply(this, UCS); //重启计时器
- } //切换图片效果
- else if ((ITF != null && (i != ITF))) {
- U.ME.ZSYHTXZ(UCS[0], UCS[1], UKE, UCS[2]); //停止在该图片上
- }
- }
- }
- //图片展示
- U.ME.ZSYHTXZ = function (UDOD, UDTD, UDE, UCL) {
- var i, _UST,
- _UDAD = $(UDOD).Child(), //获取图片子元素
- _UDCD = UDTD ? $(UDTD).Child() : null;
- for (i = 0; i < _UDAD.length; i++) {//切换样式
- $(_UDAD).addAttrArray({ "style": i == UDE[0] ? { "filter": "alpha(opacity=0)", "-moz-opacity": "0", "opacity": "0", "display": "block"} : { "display": "none"} }, i); //图片切换样式
- if (UDTD) {//如果有圆点
- _UST = _UDCD[i].className; //class
- _UDCD[i].className = _UST.replace(" " + UCL, "").replace(UCL, "") + (i == UDE[0] ? ((_UST ? " " : "") + UCL) : ""); //按钮样式
- }
- }
- $(_UDAD[UDE[0]]).animate({ "-moz-opacity": "1", "opacity": "1", "filter": "alpha(opacity=100)" }, 500); //透明度动画?
- }
- //图片轮播:通过滚动调轮播图片
- U.ME.LBTP = function (UDE) {
- var _UIE = UDE.i || 0,
- _UDOD = $(UDE.e),
- UDAD = _UDOD.Child(); //子元素
- if (UDAD.length && UDE["s"]) {
- $(UDAD[_UIE]).addAttrArray(UDE["s"]); //默认点
- U.Ut.AddObj(UDE, { a: UDAD, i: UDE.i || 0, p: UDE.p || _UDOD.Parent(), w: UDE.w || 1 });
- return new U.ME.LBTPF(UDE);
- }
- }
- //开始轮播效果
- U.ME.LBTPF = function (UDE) {
- U.Ut.AddObj(this, UDE);
- this.init();
- $(UDE.a).bind("click", U.M.apply(this, this.click));
- }
- //轮播使用
- U.ME.LBTPF.prototype = {
- init: function () {//初始化
- (this.UTI) && (clearInterval(this.UTI)); //清除原有的计时器
- this.UTI = setInterval(U.M.apply(this, this.time), this.t || 5000); //计时开始
- },
- click: function (UIE) {//点击使用
- var _UDOD, _UDPD,
- _UIE = (UIE != null && !isNaN(Number(UIE))); //判断是否不为空
- if (_UIE) {
- _UIE = this.i + UIE;
- } else {
- _UDOD = event.srcElement; //获取时间对象
- while (_UDOD && (_UDPD = _UDOD.parentNode) != this.e) {
- _UDOD = _UDPD;
- }
- _UIE = this.a.indexOf(_UDOD); //判断是否是数组
- }
- if (_UIE != -1 && _UIE != null) { this.time(_UIE); this.init(); }
- },
- time: function (UIE) {//轮换
- if (this.a[0] && this.a[0].parentNode == this.e) {
- var i, _ULT, _UAE, _UDOD,
- _UDPD = this.p,
- _UDAD = this.a,
- _UL = _UDAD.length,
- _UIE = this.i;
- if (UIE == null) {
- this.i += this.w;
- if (_UIE == _UL - 1) {
- this.w = -1; this.i = _UL - 2;
- } else if (!_UIE) {
- this.i = this.w = 1;
- }
- } else {
- this.i = UIE;
- }
- $(_UDAD[_UIE]).addAttrArray(this.h);
- $((_UDOD = _UDAD[this.i])).addAttrArray(this.s); //添加或者删除
- if (this.af) {
- this.af(this);
- }
- else {
- _UAE = [_UDPD.scrollLeft, _UDPD.offsetWidth, _UDOD.offsetLeft - this.e.offsetLeft, _UDOD.offsetWidth];
- if (_UAE[0] + _UAE[1] < _UAE[2]) {
- _ULT = _UAE[2] + _UAE[3] * 2 - _UAE[1];
- } else if (_UAE[2] < _UAE[0]) {
- _ULT = _UAE[2] - _UAE[3] * 2;
- }
- (_ULT != null) && ($(_UDPD).animate({ "scrollLeft": _ULT }, 100));
- };
- (this.cb) && (this.cb());
- }
- else {
- clearInterval(this.UTI);
- } //取消
- }
- }
- /*函数使用方法
- 函数:U.ME.DH(obj, speed, direction)
- 参数一 obj : <ul>标签对象
- 参数二 speed : 速度 单位为毫秒
- 参数三 direction : 图片滑动的方向 “T”,”B”,”L”,”R”分别为上下左右
- 实例 :
- <html>
- <head>
- <meta charset="UTF-8" />
- <script type="text/javascript" src="/uform.js"></script>
- <style>
- li{list-style-type:none;}
- #UJ_Banner_ul{}
- #UJ_Banner_ul li{ height:100px;width:100px;margin:0 10;font-size:50px;float:left;border:1px #000 solid;}
- </style>
- <script type="text/javascript" >
- window.onload = function(){
- U.ME.DH($("#UJ_Banner_ul")[0], 1000, "L");
- }
- </script>
- </head>
- <body>
- <ul id="UJ_Banner_ul">
- <li>1</li>
- <li>2</li>
- <li>3</li>
- <li>4</li>
- <li>5</li>
- </ul>
- </body>
- </html>
- 函数: U.ME.YHT(obj, point, pointclass,0,button,speed)
- 参数一 obj : <ul>标签对象
- 参数二 point: 圆点动画 没有可不传
- 参数三 pointclass: 圆点执行样式,没有可不传
- 参数四 0 : 功能未知
- 参数五 button : 左右点击的按钮 是数组形式的 没有可不传
- 参数六 speed : 速度
- 实例 :
- <html>
- <head>
- <meta charset="UTF-8" />
- <script type="text/javascript" src="/uform.js"></script>
- <style>
- li{list-style-type:none;}
- #UJ_Banner_ul{height:100px;}
- #UJ_Banner_ul li{ height:100px;width:100px;margin:0 10;font-size:50px;float:left;border:1px #000 solid;}
- #UJ_Banner_L{width:20px;height:20px;border:1px #000 solid;display:inline-block;}
- #UJ_Banner_R{width:20px;height:20px;border:1px #000 solid;display:inline-block;}
- #fround div{height:20px; width:20px;display:inline-block;border:1px #000 solid;border-radius:50%;}
- .red{background:red;}
- </style>
- <script type="text/javascript" >
- window.onload = function(){
- U.ME.YHT($("#UJ_Banner_ul")[0], $("#fround")[0], 'red', 0, [$("#UJ_Banner_L")[0], $("#UJ_Banner_R")[0]], 1000);
- }
- </script>
- </head>
- <body>
- <ul id="UJ_Banner_ul">
- <li>1</li>
- <li>2</li>
- <li>3</li>
- <li>4</li>
- <li>5</li>
- </ul>
- <div id="UJ_Banner_L">左Á¨®</div>
- <div id="UJ_Banner_R">右®¨°</div>
- <div id="fround">
- <div class="red"></div>
- <div ></div>
- <div ></div>
- <div ></div>
- <div ></div>
- </div>
- </html>
- */
|