常用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);
+=的使用
二、第一次触摸页面开启音频
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 = , _starty = null;
var _page = $("body");
_page.off("touchstart");
_page.on("touchstart", function (ev) { ev.stopPropagation();
var e = event.touches ? event.touches[] : ev; _starty = e.pageY;
_upY = ;
//alert(_starty);
console.log(_starty); });
_page.off("touchmove")
_page.on("touchmove", function (ev) { ev.stopPropagation();
var e = event.touches ? event.touches[] : ev; _upY = (_starty - e.pageY);//Y轴上:起始位置坐标减去结束位置坐标的值大于0 -----> 往上滑动 console.log(_starty); if (_upY > ) {
_upY = ;
alert("往上滑");
} });
测试的时候不要使用alert()这样会把阻止掉一些事件的,改用console.log(); 还可以参考一下网址帮助理解:
http://aresli.com/finger-direction.html
或者随机数
this.GetRand=function(minNum,minMax)
{
var _number = parseInt(Math.random() * (minMax - minNum + )) + 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);
背景音乐播放各设备下处理(可以自动播放与不可以走动播放)
<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:;}
.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;}
$(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();
} }
常用jQuery代码02的更多相关文章
- 常用jQuery代码
返回元素的html包括它本身 <div class="test"><p>hello,你好!</p></div> <script ...
- 常用jQuery代码03
1.查看浏览器信息 navigator.userAgent 检索浏览器信息包括哪些字符 例如: if (navigator.userAgent.toLowerCase().indexOf(" ...
- 常用jQuery代码01
1.点击获得当前元素索引,实现切换相应的图片路径 $(".li").bind("click", function () { var _num = $(this) ...
- js/jquery/html前端开发常用到代码片段
1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...
- 十五个常用的jquery代码段【转】
好的文章顶一个 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top 2 $('a.t ...
- 十五个常用的jquery代码段
十五个常用的jquery代码段 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top ...
- 记录下项目中常用到的JavaScript/JQuery代码二(大量实例)
记录下项目中常用到的JavaScript/JQuery代码一(大量实例) 1.input输入框监听变化 <input type="text" style="widt ...
- 最实用、最常用的jQuery代码片段
// chinacoder.cn JavaScript Document $(document).ready(function() { //.filter(":not(:has(.selec ...
- !!!常用JS代码块 (jquery)
jquery代码块 <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> ...
随机推荐
- 在visual studio中使用git版本系统(zz)
第一部分: 安装 git 开发工具 如果要使用 git 进行版本管理,其实使用 git 命令行工具就完全足够了,图形化工具(无论是 git extentions ,还是TortoiseGit),都只不 ...
- MySql Replication配置
一.前言 Mysql Replication作为读写分离的廉价解决方案,支持一主多备的方式进行数据存储,采用二进制日志传送,目前存在着广泛应用,网上相关概念也比较多,不再重复介绍.引用一张官方提供的R ...
- 看看 JDK 8 给我们带来什么(转)
世界正在缓慢而稳步的改变.这次改变给我们带来了一个新模样的JDK7,java社区也在一直期盼着在JDK8,也许是JDK9中出现一些其他的改进.JDK8的改进目标是填补JDK7实现中的一些空白——部分计 ...
- iOS应用程序本地化
一.简介 * 使用本地化功能,可以轻松地将应用程序翻译成多种语言,甚至可以翻译成同一语言的多种方言 * 如果要添加本地化功能,需要为每种支持的语言创建一个子目录,称为”本地化文件夹”,通常使用.lpr ...
- Css - 黑魔法
我们发现了一个新功能,现在你可以创建sticky块元素了.这和 fixed 块元素一样,但不同的是, sticky 块元素是不会遮挡另一个块元素的,最好看看demo 类似的功能实现还可以使用jquer ...
- php如何判断远程文件是否存在
<?php /* 函数:remote_file_exists 功能:判断远程文件是否存在 参数: $url_file -远程文件URL 返回:存在返回true,不存在或者其他原因 ...
- 活跃天数计算用户等级模仿QQ的升级方式
QQ等级的算法:设当前等级为N,达到当前等级最少需要的活跃天数为D,当前活跃天数为Dc,升级剩余天数为Dr,则: 从而推出: 好了,引述完成,懒得写字了,贴出代码: 复制内容到剪贴板 代码: < ...
- 《GK101任意波发生器》升级固件发布(版本:1.0.2build539)
一.固件说明: 硬件版本:0,logic.3 固件版本:1.0.2.build539 编译日期:2014-10-08 ====================================== 二. ...
- Java集合之Map接口
Map使用键值对来存储数据,将键映射到值对象,一个映射不能包含重复的键,每一个键最多只能映射到一个值.Map接口的具体实现类:HashMap,Hashtable,TreeMap,LinkedHashM ...
- Javascript 笔记与总结(2-6)var
[例] <script> window.str = 'abc'; function t1(){ function t2(){ str = 'xyz'; alert(str); } t2() ...