登入 註冊
 

固定式浮動客服按鈕、視窗
閱讀 4172 次 0 會員 與 1 訪客 正在閱讀本文。
七月 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>
完成

記錄

* 九月 14, 2012, 02:20:18 下午
#1
我想要商城內每個網頁都能看到 浮動訊息,
請問要在哪個檔案加上這個程式碼?
<script type="text/javascript" src="http://你的網址/js/toolbar.js"></script>
<div id="toolbar-box">
浮動視窗內的程式碼...
</div>

記錄

九月 14, 2012, 05:28:14 下午
#2
page_footer.lbi
就可以

記錄

* 九月 15, 2012, 11:56:54 下午
#3
已解決,感恩!!

記錄

* 十一月 04, 2013, 05:44:31 下午
#4
andy:我照你說的步驟方法,結果網頁只顯示"浮動視窗內的程式碼"
我的網址:www.dolemi.com.tw,不知道問題出在哪裡ㄝ

記錄

十一月 04, 2013, 06:11:49 下午
#5
把【浮動視窗內的程式碼】改成你要顯示的內容
背景顏色不可省略...

記錄

* 十一月 04, 2013, 06:34:56 下午
#6
請問andy有公版的樣式程式碼可以提供嗎?小弟真的是不懂程式語言,只會剪剪貼貼而已,,

記錄

十一月 04, 2013, 06:54:29 下午
#7
就把那些字換成你要顯示的內容
哪需要程式語言!

記錄