常用js个人汇总

旧巷老猫 提交于 2020-04-02 09:30:26

//px转换为rem
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
if (clientWidth >= 750) {
docEl.style.fontSize = '100px';
} else {
docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
}
};

if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);


// 页面刷新 回到顶部
$('html ,body').animate({ scrollTop:-10},300);
// 头部导航 悬浮
$(window).scroll(function(){

var navtop = $('.head_nav').offset().top;
console.log(navtop);

document.addEventListener('scroll', function (event) {
var scrollDistance = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
if (scrollDistance >= 110) { // 触发的位置
document.getElementsByClassName('head_nav')[0].style.cssText = 'position:fixed;top:0px;z-index:999;';
} else {
document.getElementsByClassName('head_nav')[0].style.cssText = 'position:relative;';
}
});

})


// px 转换 rem

~function () {
var winW = document.documentElement.clientWidth;
document.documentElement.style.fontSize = winW / 750 * 100 + "px";
}();

 

$(window).resize(function(){

~function () {
var winW = document.documentElement.clientWidth;
document.documentElement.style.fontSize = winW / 750 * 100 + "px";
}();

})

alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin

 

// swiper 鼠标移入停止轮播图,移出开始轮播
$('.swiper-container').mouseenter(function(){
// swiper.stopAutoplay();
mySwiper.autoplay.stop();
}).mouseleave(function(){
// swiper.startAutoplay();
mySwiper.autoplay.start();
})


// jquery新版本不支持 toggle()的解决方法 让高版本的jquery兼容toggle()事件。
$.fn.toggle = function( fn, fn2 ) {
var args = arguments,guid = fn.guid || $.guid++,i=0,
toggle = function( event ) {
var lastToggle = ( $._data( this, "lastToggle" + fn.guid ) || 0 ) % i;
$._data( this, "lastToggle" + fn.guid, lastToggle + 1 );
event.preventDefault();
return args[ lastToggle ].apply( this, arguments ) || false;
};
toggle.guid = guid;
while ( i < args.length ) {
args[ i++ ].guid = guid;
}
return this.click( toggle );
};

 

var ul = $('.productList-nav ul');
var lis = ul.children("li");
lis.each(function(i,el){
if(i%3==0){
ul.before("<ul>");
};
ul.prev("ul").append(el);
});
ul.remove();

// swiper rem
var fileSwiper = new Swiper('.film-wrap',{
***width:4.8*font_size,***
wrapperClass:"film",
slideClass: 'film-item',
loop:true,
spaceBetween : 0,
prevButton:'.left-arrow',
nextButton:'.right-arrow',
preventClicks : true,
loopedSlides :0,
slidesPerView : 'auto',
});

function getWindowSize() {
if (self.innerHeight) { // WEBKIT
return { 'width':self.innerWidth, 'height':self.innerHeight };
} else if (document.documentElement && document.documentElement.clientHeight) { // IE standards 模式
return {
'width' :document.documentElement.clientWidth,
'height':document.documentElement.clientHeight
};
} else if (document.body) { // IE quirks 模式
return {
'width' :document.body.clientWidth,
'height':document.body.clientHeight
};
}
}

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!