js片段

最新推荐文章于 2024-06-25 17:01:11 发布

咏春

最新推荐文章于 2024-06-25 17:01:11 发布

阅读量152

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/weixin_44086715/article/details/84991933

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一、判断浏览器版本是否过低

$(document).ready(function() {
var b_name = navigator.appName;
var b_version = navigator.appVersion;
var version = b_version.split(";");
var trim_version = version[1].replace(/[ ]/g, "");

if (b_name == "Microsoft Internet Explorer") {
    /*如果是IE6或者IE7*/
    if (trim_version == "MSIE7.0" || trim_version == "MSIE6.0" || trim_version == "MSIE8.0" || trim_version == "MSIE9.0") {
    alert("IE浏览器版本过低，请到指定网站去下载相关版本");
    //然后跳到需要连接的下载网站
    window.location.href="https://www.baidu.com/";
    }
}
});

二、文本内容超出div高度…显示【jq方法】

.text {
background: #EEE;
width: 410px;
height: 40px; /* 高度要固定 */
margin: 10px;
}
.text p{
margin: 0;
line-height: 20px;
font-size: 14px;
}

html

div.text>p

<script type="text/javascript">
	$(".text").each(function (i) {
	     var divH = $(this).height();
	     var $p = $("p", $(this)).eq(0);
	     while ($p.outerHeight() > divH) {
	         $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
	     }
	 });
</script>

三、一个弹框模块

input#btnLis_add //弹出按钮
div.layCover //蒙版
div.TW_dig // 弹框
------b.bClosed //关闭按钮

<script>
	$(document).ready(function() {
		var hDig   = $(".TW_dig").height();
		var hWid   = $(window).height();
		var hDoc   = $(document).height();
		var sTop = $(document).scrollTop();
		var hMax,topDig;

		$("#btnLis_add").on("click",function(){

			$(".layCover").show();
			$(".TW_dig").show();
			hDig = $(".TW_dig").height();
			hWid = $(window).height();
			hDoc = $(document).height();
                        sTop = $(document).scrollTop();
			hMax = hDig > hWid ? (hDig>hDoc ? hDig  :  hDoc ) : (hWid>hDoc ? hWid : hDoc);

			if($(".TW_dig").height()<$(window).height()){   //垂直居中
				hWid   = $(window).height();
				hDig   = $(".TW_dig").height();
				topDig = (hWid-hDig)/2+sTop;
				$(".TW_dig").css({top: topDig});
			}else{
				$(".TW_dig").css({top: 30});
			};

			$(".layCover").height(hMax);   //蒙版高度

		});

		$(".bClosed").click(function(event) {  //关闭弹框按钮
			$(".layCover").hide();
			$(this).closest(".TW_dig").hide();
		});
		
	});
</script>

四、标签延迟显示和延迟消失

<script>

var timer,xt,yt;
timer = {
    tEnter: function(e){
        clearTimeout(xt);
        xt = setTimeout(function(){
            if ($(e.target).eq(0).is($(".a_bef"))) {
                var tSet   = $(e.target).offset();
                X      = tSet.left + 20,
                Y      = tSet.top + 20;
                $(".stepTip").stop().css({position:"absolute",left:X,top:Y}).fadeIn(200);
            };
        }, 200);
    },
    tOut: function(){
        clearTimeout(yt);
        yt=setTimeout(function(){
            $(".stepTip").stop().fadeOut(400);
        }, 500);
        if (true) {};
    }
};

$("#stepTops li .a_bef").hover(function(e) {  
    clearTimeout(yt);
    timer.tEnter(e);
},function(){
    clearTimeout(xt);
    timer.tOut();
    $(".stepTip").hover(function() {
        clearTimeout(yt);
    }, function() {
        timer.tOut();
    });
});

</script>

五、判断设备是pc还是移动端

var __device = (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent.toLowerCase()));
console.log(__device); //PC端输出false，移动端输出true

//兼容微信自动播放
if(navigator.userAgent.toLowerCase().match(/micromessenger/i)){
	document.addEventListener("WeixinJSBridgeReady",function onBridgeReady(){
		WeixinJSBridgeReady.invoke("getNetworkType",{},function(e){
			audioFN.play(); //执行自动播放程序
		})
	})
}