DEDECMS幻燈片中JavaScript的應(yīng)用方式

DEDECMS幻燈片中JavaScript的應(yīng)用方式？這個(gè)問題可能是我們?nèi)粘W(xué)習(xí)或工作經(jīng)常見到的。希望通過這個(gè)問題能讓你收獲頗深。下面是小編給大家?guī)淼膮⒖純?nèi)容，讓我們一起來看看吧！

DEDECMS幻燈片中JavaScript怎么應(yīng)用？

今天在制作模板的時(shí)候遇到了一個(gè)小問題，不過通過查閱網(wǎng)站上的各種資料最終還是得以解決了。

由于這個(gè)問題正好與最近Zero學(xué)習(xí)的JavaScript有一點(diǎn)點(diǎn)關(guān)系，所以Zero就將這個(gè)問題以及如何實(shí)現(xiàn)JavaScript幻燈特效與DEDECMS調(diào)用標(biāo)簽的相互融合做一個(gè)小小的總結(jié)。

問題：如何在DEDECMS欄目頁插入幻燈片，同時(shí)實(shí)現(xiàn)幻燈片里面的圖片、標(biāo)題、描述自動調(diào)用。

第一、找一個(gè)心儀的幻燈片特效代碼。

就我目前所學(xué)到的這點(diǎn)知識要做一個(gè)幻燈片那真是望塵莫及，不會做怎么辦？網(wǎng)上找源碼，當(dāng)然有源碼的網(wǎng)址還有很多，但是Zero并不提倡，所以就要努力學(xué)習(xí)告別這種拿來主義的現(xiàn)狀。

第二、將找到的幻燈代碼插入到欄目模板的相關(guān)位置。

插入方法也很簡單，至需要改變一些調(diào)用代碼的路徑，這點(diǎn)我想大部分朋友都能夠理解。（同時(shí)別忘了在頭部加上調(diào)用JS文件）

以Zero所使用的幻燈片源文件為例：

JS調(diào)用文件

插入頁面JS代碼

當(dāng)然調(diào)用完以后還要將調(diào)用文件放在相應(yīng)的目錄文件下。

第三步：圖片調(diào)用代碼

只將放燈片放到網(wǎng)頁中，是件很容易的事情。但是要實(shí)現(xiàn)幻燈片中的圖片、title、描述自動調(diào)用就顯得不那么容易了，至少Zero就認(rèn)為不那么容易完成（有其是對JS文件無法修改的時(shí)候）。

下面是Zero在網(wǎng)上找的幻燈片源文件：

代碼如下:

<div id=”FocusObj” ></div> 
<script type=”text/javascript”> 
<!–// 
var focus_width=240; 
var focus_height=300; 
var text_height=1; 
var swf_height=focus_height + 0; 
var pics=”images/01.jpg###images/02.jpg###images/03.jpg###images/04.jpg###images/05.jpg”; 
var links=”https://www.jb51.net/###https://www.jb51.net/###https://www.jb51.net/###https://www.jb51.net/###https://www.jb51.net/”; 
var texts=”CG渲染的街霸4春麗讓人噴血###網(wǎng)游第一美女竟能秒殺周迅？###這不是CG！這是實(shí)際游戲截圖###神形兼?zhèn)涞娜蕩炖瑿osplsy賞###聚龍匯攜手IEST 電競?cè)駞⑴c”; 
var descripts=”MーRS所制作的3D CG人物靈氣不足，但風(fēng)格強(qiáng)烈，讓人###香港《明報(bào)》文娛版刊登了題為《李大齊與周迅分手的###《極限競速》是XBOX陣營第一賽車游戲，在E3上最新的###《拳皇》中的庫拉走到現(xiàn)實(shí)中會是個(gè)什么樣呢？我們來###聯(lián)想IEST由全球第三大PC企業(yè)聯(lián)想集團(tuán)主辦，通過大規(guī)”; 
var fo = new SWFObject(“swf/pix.swf”, “_FocusObj”, focus_width, swf_height, “7″,”F6F8FA”); 
fo.addVariable(“pics”, pics); 
fo.addVariable(“l(fā)inks”, links); 
fo.addVariable(“texts”, texts); 
fo.addVariable(“descripts”, descripts); 
fo.addVariable(“borderwidth”, focus_width); 
fo.addVariable(“borderheight”, focus_height); 
//fo.addVariable(“textheight”, text_height); 
fo.addVariable(“border_color”, “#dcd0c2″); 
//fo.addVariable(“fontsize”, “24″); 
//fo.addVariable(“fontcolor”, “FFFFFF”); 
fo.addVariable(“is_border”, “”); 
fo.addVariable(“is_text”, “1″); 
fo.addParam(“wmode”, “opaque”); 
fo.write(“FocusObj”); 
//–> 
</script>

從幻燈片的源碼中可以看出本放燈片的所有圖片、title、描述都是固定的，不能靈活調(diào)用。如果要實(shí)現(xiàn)靈活調(diào)用，我們就必須要用到DEDE的調(diào)用標(biāo)簽，這里Zero使用了dede:arclist標(biāo)簽實(shí)現(xiàn)了調(diào)用。不過在調(diào)用時(shí)我們需要注意以下幾點(diǎn)：

1、###分隔，由于最后一條數(shù)據(jù)結(jié)尾不需要###分隔，因此1-4條和最后一條需要分開處理。這里Zero采用limit標(biāo)簽實(shí)現(xiàn)，limit標(biāo)簽在以后接觸mysql數(shù)據(jù)庫時(shí)會詳細(xì)介紹。

2、兩條數(shù)據(jù)中間不能有空格，也就是說images/01.jpg###images/02.jpg這樣的兩條數(shù)據(jù)之間是不能允許有空格和換行的，如果有則不能運(yùn)行。而arclist調(diào)用數(shù)據(jù)時(shí)會自動出現(xiàn)空格和換行，那么怎么辦呢？修改arclist.lib.php文件413行中的$artlist .= $dtp2->GetResult().”\r\n”;修改為：$artlist .= $dtp2->GetResult()。（當(dāng)然通過調(diào)整JS也可以達(dá)到同樣的效果，但是目前Zero對于JS還不夠熟悉因此只能通過修改DEDECMS源碼來實(shí)現(xiàn)）

3、幻燈片中的title標(biāo)簽里不能出現(xiàn)修飾性代碼，比如“<font color=’#FF0000′>Zero的php博客-零基礎(chǔ)PHP教程</font> ”。如果出現(xiàn)這類標(biāo)簽在JS文件中，將不能被解釋。因此我們需要格式化html文件，因此在title調(diào)用一欄中Zero使用了[field:title function='html2text(@me)'/]標(biāo)簽調(diào)用。

好了到這里一個(gè)能在DEDECMS里自動調(diào)用圖片、title、描述的幻燈片就調(diào)試完畢了。

感謝各位的閱讀！看完上述內(nèi)容，你們對DEDECMS幻燈片中JavaScript的應(yīng)用方式大概了解了嗎？希望文章內(nèi)容對大家有所幫助。如果想了解更多相關(guān)文章內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道。