代理加盟 2020全新代理計劃 賺錢+省錢雙管齊下,獨立平臺,豐厚利潤!

您現在的位置: 秀站網 > 織夢大學 > 使用教程 >

DedeCMS文章內容圖片延遲加載

來源:本站原創 發布時間:2019-03-31 13:46:16熱度:我要評論(0

免費下載,無需注冊無需充值

lazyload圖片延遲加載

       DedeCMS首頁、列表實現延遲加載參考網站圖片Lazyload延遲加載技術, 下載兩個必要文件。在</head>之前加入如下代碼

<script data-original="jquery-1.11.0.min.js"></script><!--請下載到本地-->
<script data-original="jquery.lazyload.js"></script><!--請下載到本地-->
<script type="text/javascript" charset="utf-8">$(function(){$("img.lazy").lazyload({effect: "fadeIn"});});</script>

       修改文章內容body圖片標簽,加上class="lazy",替換src為data-original,即

< img src='圖片地址' alt='圖片說明'/>

       修改為

< img class='lazy' data-original='圖片地址'alt='圖片說明'/>

       用到PHP函數str_replace。語法:

str_replace(find,replace,string,count)

find 必需,規定要查找的值。
replace 必需,規定替換 find 中的值的值。
string 必需,規定被搜索的字符串。
count 可選,一個變量,對替換數進行計數。

       替換多個查找值需要放到array里面,如

str_replace(array("a" , "b") , array("c" , "d") , abcde); //a替換成c,b替換成d,最后輸出:cdcde

修改方法一

      打開include/arc.archives.class.php,找到

//設置全局環境變量
$this->Fields['typename'] = $this->TypeLink->TypeInfos['typename'];
@SetSysEnv($this->Fields['typeid'],$this->Fields['typename'],$this->Fields['id'],$this->Fields['title'],'archives');

       第二行修改為

@SetSysEnv($this->Fields['typeid'],$this->Fields['typename'],$this->Fields['id'],$this->Fields['title'],
$this->Fields['body']=str_replace(array("<img","src"),array("<img class='lazy'","data-original"),$this->Fields['body']),'archives');

       這個方法不靈活,會把body里面所有“<img”、“src”都替換,一般的網站還行,像秀站網博客這樣技術性源代碼多的就好辦了。另外還有附件路徑原來是相對路徑,做了絕對路徑修改也需要用到srt_replace函數,干脆整合到一起,修改如下:

修改方法二

       打開included/extend.fuc.php,在最后面增加ImgUrl函數,下面橙色部分為你的域名:     

function ImgUrl($newurl){
    $newurl = str_replace('src="/uploads/','class="lazy" data-original="http://www.yxrxyy.live/uploads/',$newurl);
    return $newurl;
}

       模板調用

{dede:field.body function='ImgUrl(@me)'/}

修改方法三

       可以把PHP函數直接寫到模板里面,模板調用:

{dede:field.body function="str_replace('src="/uploads/','class="lazy" data-original="http://www.xiuzhanwang.com/uploads/',@me)"/}

轉載請注明來源網址:http://www.yxrxyy.live/dedecms_jq/1377.html

    發表評論

    評論列表(條)

      北京28是什么彩票