原來如此

網路開店購物系統 => ECShop 安裝、設定、使用 => 主題作者是: andy 於 七月 25, 2011, 01:04:53 下午

主題: 固定式浮動客服按鈕、視窗
作者: andy七月 25, 2011, 01:04:53 下午
既然浮動,又為何要固定?你會有這個疑問也是正常的,因為實在不知要用什麼標題形容這個功能原本使用浮動視窗的時候,浮動視窗都會隨著頁面的捲動而上下震盪,有時還會因為連線問題而卡住,但是以下介紹的功能,不管你視窗如何捲動,浮動視窗都會一直固定在那裡,動都不敢動一下,設定方法也極為簡單,任何類型的網站都能使用,因此以下步驟只是方法,請大家自行運用。演示請看本站左上角的客服圖片:
1、在你的CSS(樣式表)的最後加上:

代碼: [選擇]
#toolbar-box {
_display:none;
position:fixed;
bottom:5px;
right:0px;
width:200px;
right:0px;
height:61px;
z-index:1000000;
background-color: transparent;
}
bottom:5px;
right:0px;
是指定浮動視窗的位置top(上)、bottom(下)、left(左)、right(右)
要靠左上就用:
top:5px;
left:0px;
2、下載「toolbar.js」,儲存在根目錄的js資料夾內(如果沒有js資料夾就自己新增),

3、將底下程式碼改為實際內容,放在網頁或模板的</html>之後(就是網頁的最後):
代碼: [選擇]
<script type="text/javascript" src="http://你的網址/js/toolbar.js"></script>
<div id="toolbar-box">
浮動視窗內的程式碼...
</div>
完成
主題: Re: 固定式浮動客服按鈕、視窗
作者: qaw3388九月 14, 2012, 02:20:18 下午
我想要商城內每個網頁都能看到 浮動訊息,
請問要在哪個檔案加上這個程式碼?
<script type="text/javascript" src="http://你的網址/js/toolbar.js"></script>
<div id="toolbar-box">
浮動視窗內的程式碼...
</div>
主題: Re: 固定式浮動客服按鈕、視窗
作者: andy九月 14, 2012, 05:28:14 下午
page_footer.lbi
就可以
主題: Re: 固定式浮動客服按鈕、視窗
作者: qaw3388九月 15, 2012, 11:56:54 下午
已解決,感恩!!
主題: Re:固定式浮動客服按鈕、視窗
作者: alanlin十一月 04, 2013, 05:44:31 下午
andy:我照你說的步驟方法,結果網頁只顯示"浮動視窗內的程式碼"
我的網址:www.dolemi.com.tw (http://www.dolemi.com.tw),不知道問題出在哪裡ㄝ
主題: Re:固定式浮動客服按鈕、視窗
作者: andy十一月 04, 2013, 06:11:49 下午
把【浮動視窗內的程式碼】改成你要顯示的內容
背景顏色不可省略...
主題: Re:固定式浮動客服按鈕、視窗
作者: alanlin十一月 04, 2013, 06:34:56 下午
請問andy有公版的樣式程式碼可以提供嗎?小弟真的是不懂程式語言,只會剪剪貼貼而已,,
主題: Re:固定式浮動客服按鈕、視窗
作者: andy十一月 04, 2013, 06:54:29 下午
就把那些字換成你要顯示的內容
哪需要程式語言!