常用jQuery代码02

一、each函数拿到每个元素的宽度
    setTimeout(function () {
        $(".sticker_list img").each(function () {

            var Width = $(this).width();
            var Height = $(this).height();
            // alert(Width);
            // alert(Height);
            $(this).css({ "margin-left": (Width / 2) * (-1) + "px", "margin-top": (Height / 2) * (-1) + "px" });
        });
    }, 500);
 

wpsBD4B.tmp

+=的使用

 

二、第一次触摸页面开启音频

 Audio = new Audio("audio/music.mp3");
        Audio.load;
        Audio.loop = true;
        Audio.play();

  

$("body").one("touchstart", function () {  if (!!sound.paused) { sound.play(); }  });
 
$(".music_btn").on("touchstart", function () {
           // alert("d");
            if (!!Audio.paused) {
                $(".music_btn").removeClass("stop");
                Audio.play();
            } else {
                $(".music_btn").addClass("stop");
                Audio.pause()
            }

        });

  

 
三、整体尺寸缩小
 
$("#GuanKa .page_content").css("transform", "scale(0.92)");

四、序列帧图片切换

function SuiPian() {

    var _i = 1;

    setTimeout(function () {
        _Change = setInterval(function () {
            ++_i;
            //alert(_i);
            $(".step07_pic").attr("src", "images/intro/step07_pic0" + _i + ".png");
            if (_i >= 5) { clearInterval(_Change); _i = 0; }
        }, 500);
    }, 1800);
}

 或者这样也可以

 $(".music_animate_box img").fadeIn();

                    var _index =1;
                    _MusicAnimate = setInterval(function () {

                        $(".music_animate_box img").attr("src", "images/addLoading/music_pic/music00" + _index + ".png");
                        _index++;
                        console.log(_index);
                        if (_index > 64) { _index=1 }
                    },40);
//滑动切换

                var _upY = 0, _starty = null;
                var _page = $("body");
                _page.off("touchstart");
                _page.on("touchstart", function (ev) {

                    ev.stopPropagation();
                    var e = event.touches ? event.touches[0] : ev;

                    _starty = e.pageY;
                    _upY = 0;
                    //alert(_starty);
                    console.log(_starty);

                });
                _page.off("touchmove")
                _page.on("touchmove", function (ev) {

                    ev.stopPropagation();
                    var e = event.touches ? event.touches[0] : ev;

                    _upY = (_starty - e.pageY);//Y轴上:起始位置坐标减去结束位置坐标的值大于0 -----> 往上滑动

                    console.log(_starty);

                    if (_upY > 60) {
                        _upY = 0;
                        alert("往上滑");
                    }

                });
测试的时候不要使用alert()这样会把阻止掉一些事件的,改用
console.log();

还可以参考一下网址帮助理解:
http://aresli.com/finger-direction.html



 或者随机数

this.GetRand=function(minNum,minMax)
    {
        var _number = parseInt(Math.random() * (minMax - minNum + 1)) + minNum;
        return _number;
    }

var _num1 = "images/result/index_num" + SiteFunc.GetRand(6, 9) + ".png";
var _num2 = "images/result/index_num" + SiteFunc.GetRand(0, 9) + ".png";

 

GetRand=function(minNum,minMax)
{
var _number = parseInt(Math.random() * (minMax - minNum + 1)) + minNum;
return _number;
}
GetRand(1,8);//5


 随机获取一个颜色

"#"+("00000"+((Math.random()*16777215+0.5)>>0).toString(16)).slice(-6); 

 10秒以内的假loading

中间慢

 var _Num = 1;

        function SetLoadingTime(speed) {
            _Num++;
            if (_Num > 10) {
                Audio.play();
                if (!(Cmn.Func.IsIOS())) {
                    Audio.play();
                   // $(".add_music_btn").removeClass("stop");
                }

            }

            if (_Num > 100) {
                clearTimeout(ts1);

                CanSlide = true;

                $(".step01").hide();
                $(".step02").show();

                return;

            }
            console.log("CanSlide:" + CanSlide);




            $(".add_load_num span").html(_Num);

            if (60 > _Num && _Num > 50) {
                speed = 150;
            } else if (_Num > 60) {
                speed = 50;
            }

            Cmn.DebugLog("_num:" + _Num);

            ts1 = setTimeout(function () {
                SetLoadingTime(speed);
            }, speed);

        }
 SetLoadingTime(50);
View Code

 背景音乐播放各设备下处理(可以自动播放与不可以走动播放)

<div class="music_box Js_music_box "><a href="javascript:void(0)"></a><audio id="Js_audio" src="music/ongaku.mp3" autoplay="autoplay"></audio></div>
.music_box{position:absolute;top:18px;right:18px;width:50px;height:50px;z-index:100;}
.music_box a{background:url(../images/png/sounds0001.png) no-repeat ;width:100%;height:100%;display:block;}
.music_box.select a{background:url(../images/soundoff.png) no-repeat;}
View Code
$(document).ready(function () {

    var _ts;

    var _Num = 1;

    

        $("#Js_audio").get(0).play();
        _ts = setInterval(function () {
            $(".music_box a").css("background", "url(images/png/sounds000" + _Num + ".png) no-repeat");
            _Num++;
            console.log(_Num);
            if (_Num >= 8) { _Num = 1 }
        }, 200);

        if (!!Js_audio.paused) {
            clearInterval(_ts);
            $(".music_box a").css("background", "url(images/soundoff.png) no-repeat");
        }

      $("body").one("touchstart", function () {
       
        if (Cmn.Func.IsIOS()) {

            if ($("#Js_audio").get(0).paused) {
                $(".Js_music_box").removeClass("select");
                $("#Js_audio").get(0).play();

                _ts = setInterval(function () {
                    $(".music_box a").css("background", "url(images/png/sounds000" + _Num + ".png) no-repeat");
                    _Num++;
                    Cmn.DebugLog(_Num);
                    Cmn.DebugLog($(".music_box a").css("background-image"));

                    if (_Num >= 8) { _Num = 1 }


                }, 200);

            }
        }
    });



    $(".Js_music_box").on("touchstart", function () {
        // alert("d");
        if (!!Js_audio.paused) {
            
            Audio(true);
            $(".Js_music_box").removeClass("select");
          
            //var _Num = 1;
            _ts = setInterval(function () {
                $(".music_box a").css("background", "url(images/png/sounds000" + _Num + ".png) no-repeat");
               _Num++;
               console.log(_Num);
               Cmn.DebugLog($(".music_box a").css("background-image"));
                if (_Num >= 8) { _Num =1}
            }, 200);


        } else {
            
            Audio(false);
            clearInterval(_ts);
          
            $(".music_box a").css("background", "url(images/soundoff.png) no-repeat");
            Cmn.DebugLog($(".music_box a").css("background-image"));
        }

    });


});

function Audio(bol)
{
    if (bol) {
        $("#Js_audio").get(0).play();
    }
    else {
        $("#Js_audio").get(0).pause();
    }

}
View Code
 
原文地址:https://www.cnblogs.com/ruoqiang/p/4501510.html