323
This commit is contained in:
小赵同学 committed
1 parent
3d13352dea
commit
eeebe555af
169 files changed
+26747
No files matched your search
@@ -0,0 +1,227 @@
|
||||
// 定义pjax 预设pjax
|
||||
var pjax = new Pjax({
|
||||
// 这里填写页面中改变的部分（和 CSS 选择器用法一样）
|
||||
selectors: ["#pjax-container"],
|
||||
cacheBust: false,
|
||||
elements: "a",
|
||||
});
|
||||
// 设置图片灯箱回调函数
|
||||
function lazyimg_pjax() {
|
||||
; (function ($) {
|
||||
|
||||
var defaults = {
|
||||
coverColor: "#dfdfdf",
|
||||
coverDiv: "",
|
||||
showTime: 300,
|
||||
offsetBottom: 0,
|
||||
offsetTopm: 50,
|
||||
onLoadBackEnd: function (index, dom) { },
|
||||
onLoadBackStart: function (index, dom) { }
|
||||
}
|
||||
|
||||
//所有待load src
|
||||
var srcList = []
|
||||
var lazyLoadCoutn = 0;
|
||||
var windowHeight = $(window).height();
|
||||
var windowWidth = $(window).width();
|
||||
var lazyImgList = $("img[data-lazy-src]");
|
||||
var default_base64_src = "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==";
|
||||
|
||||
//获取img
|
||||
function getImgNaturalDimensions(src, callback, lazyLoadCoutn) {
|
||||
var nWidth, nHeight
|
||||
var image = new Image()
|
||||
image.src = src;
|
||||
image.onload = function () {
|
||||
callback(image.width, image.height);
|
||||
defaults.onLoadBackStart(lazyLoadCoutn, $("img[data-lazy-src]:eq(" + lazyLoadCoutn + ")"));
|
||||
}
|
||||
return [nWidth, nHeight];
|
||||
}
|
||||
|
||||
function showImg(lazyLoadCoutn, callback) {
|
||||
|
||||
var src = lazyImgList.eq(lazyLoadCoutn).attr("data-lazy-src")
|
||||
getImgNaturalDimensions(src, function () {
|
||||
try {
|
||||
|
||||
meng($("img[data-lazy-src]:eq(" + lazyLoadCoutn + ")"), lazyLoadCoutn, callback)
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
}, lazyLoadCoutn)
|
||||
}
|
||||
|
||||
function meng(jDom, lazyLoadCoutn, callback) {
|
||||
if (jDom.attr("data-comp")) {
|
||||
return;
|
||||
}
|
||||
jDom.css("visibility", "hidden");
|
||||
jDom.attr("src", jDom.attr("data-lazy-src"))
|
||||
var w = jDom.width();
|
||||
var h = jDom.height();
|
||||
var offsetTop = jDom.offset().top;
|
||||
var offsetLeft = jDom.offset().left;
|
||||
|
||||
jDom.css("visibility", "visible");
|
||||
$("body").append("<div class='meng-lazy-div" + lazyLoadCoutn + "' style='background-color: " + defaults.coverColor + ";position:absolute;width:" + w + "px;height:" + h + "px;top:" + offsetTop + "px;left:" + offsetLeft + "px;z-index:500'>" + defaults.coverDiv + "</div>");
|
||||
noneM(lazyLoadCoutn, callback, jDom);
|
||||
jDom.attr("data-comp", "true");
|
||||
}
|
||||
|
||||
function noneM(lazyLoadCoutn, callback, jDom) {
|
||||
if (true) {
|
||||
$(".meng-lazy-div" + lazyLoadCoutn).animate({ opacity: "0" }, defaults.showTime, function () {
|
||||
$(this).remove();
|
||||
defaults.onLoadBackEnd(lazyLoadCoutn, jDom)
|
||||
callback();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function checkOffset() {
|
||||
var scrollTop = $(document).scrollTop();
|
||||
var onlazyList = [];
|
||||
lazyImgList.each(function (index) {
|
||||
var dom = $(this);
|
||||
if (!dom.attr("data-comp")) {
|
||||
if (dom.offset().top - scrollTop + defaults.offsetTopm >= 0 && dom.offset().top - scrollTop < (windowHeight + defaults.offsetBottom)) {
|
||||
onlazyList.push(index);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
if (onlazyList.length != 0) {
|
||||
showImg(onlazyList[0], function () {
|
||||
checkOffset();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function range() {
|
||||
checkOffset();
|
||||
|
||||
}
|
||||
|
||||
function init(setting) {
|
||||
lazyImgList = $("img[data-lazy-src]");
|
||||
defaults = $.extend(defaults, setting);
|
||||
|
||||
lazyImgList.each(function () {
|
||||
var sr = $(this).attr("data-lazy-src");
|
||||
srcList.push(sr);
|
||||
|
||||
$(this).attr("src", default_base64_src);
|
||||
});
|
||||
range();
|
||||
window.onscroll = function () {
|
||||
range()
|
||||
}
|
||||
}
|
||||
function tryAgain() {
|
||||
$("img[data-lazy-src]").removeAttr("data-comp")
|
||||
init(defaults)
|
||||
}
|
||||
|
||||
window.lazyLoadInit = init;
|
||||
|
||||
window.lazyLoadAgain = tryAgain;
|
||||
|
||||
|
||||
})($)
|
||||
}
|
||||
// 设置pjax预先加载代码
|
||||
function pjax_reload() {
|
||||
// 给pjax容器加入css过渡动画
|
||||
$("#pjax-container").addClass("uk-animation-slide-bottom-small");
|
||||
// 评论区过渡动画
|
||||
$(".comment-meta").attr("uk-scrollspy", "cls: uk-animation-fade; delay: 100");
|
||||
$(".comment-author vcard").attr("uk-scrollspy", "cls: uk-animation-fade; delay: 100");
|
||||
$(".comment-metadata").attr("uk-scrollspy", "cls: uk-animation-fade; delay: 100");
|
||||
$(".comment-content").attr("uk-scrollspy", "cls: uk-animation-fade; delay: 100");
|
||||
$(".reply").attr("uk-scrollspy", "cls: uk-animation-fade; delay: 100");
|
||||
// 说说页面过渡动画
|
||||
$("#shuoshuo_body").attr("uk-scrollspy", "target: > .shuoshuo; cls: uk-animation-fade; delay: 250");
|
||||
}
|
||||
// pjax发送时期
|
||||
document.addEventListener("pjax:send", function () {
|
||||
// pjax动画减少圆圈动画
|
||||
NProgress.configure({
|
||||
showSpinner: false
|
||||
});
|
||||
// pjax执行动画开始
|
||||
NProgress.start(); //加载动画效果开始
|
||||
});
|
||||
// Pjax 成功后，重新加载下面的函数
|
||||
document.addEventListener("pjax:success", function () {
|
||||
// 重载图片懒加载插件的js
|
||||
lazyimg_pjax()
|
||||
lazyLoadInit({
|
||||
coverColor: "white",
|
||||
coverDiv: "<div style='display: flex; justify-content: center; align-items: center; height: 200px; color: #000000;'><span>优世界·一个记录生活点滴的小站</span></div>",
|
||||
offsetBottom: 0,
|
||||
offsetTopm: 0,
|
||||
showTime: 1100
|
||||
});
|
||||
// 激活文章图片灯箱
|
||||
window.ViewImage && ViewImage.init('.post-content img');
|
||||
});
|
||||
// pjax加载完成
|
||||
document.addEventListener("pjax:complete", function () {
|
||||
// pjax完成动画
|
||||
NProgress.done();
|
||||
// 重载一些js样式调整
|
||||
pjax_reload()
|
||||
// 重载友圈函数
|
||||
// fcircle_pjax()
|
||||
// 激活返回顶部插件
|
||||
$(function () {
|
||||
$.scrollUp({
|
||||
animation: 'fade',
|
||||
scrollImg: true
|
||||
});
|
||||
});
|
||||
// 重载评论
|
||||
if(document.querySelector("#Comments")){
|
||||
// Waline.init({
|
||||
// el: '#waline',
|
||||
// serverURL: 'https://waline.usj.cc',
|
||||
// lang: "zh-cn",
|
||||
// imageUploader: false,
|
||||
// search: false,
|
||||
// copyright: false,
|
||||
// requiredMeta:['nick', 'mail'],
|
||||
// login:'enable',
|
||||
// pageSize:10,
|
||||
// highlighter:true,
|
||||
// reaction: [
|
||||
// '/image/EhqxZ6DFIJojGNa.gif',
|
||||
// '/image/qmf5As3evWNXwGQ.gif',
|
||||
// '/image/ueWLPkmYw75x4cs.gif',
|
||||
// '/image/nsC1OGoBKfa8Hel.gif',
|
||||
// '/image/VKuBXqR91TPHnyc.gif',
|
||||
// '/image/2OmAWPeulq4ta8T.gif'
|
||||
// ],
|
||||
// });
|
||||
Artalk.init({
|
||||
el: '#Comments', // 绑定元素的 Selector
|
||||
server: 'https://pl.t-t.live/', // 后端地址
|
||||
site: '优世界', // 你的站点名
|
||||
flatMode:false
|
||||
})
|
||||
}
|
||||
// 重载文章弹幕
|
||||
if(!isMobile()){
|
||||
loadBarrager();
|
||||
}
|
||||
//当前页面是否为移动端
|
||||
if (isMobile()) {
|
||||
console.log('"当前为移动端"');
|
||||
} else {
|
||||
console.log('"当前为电脑端"');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in new issue
Block a user