客服菜单上下滚动效果实现

Posted 2020-11-17 chensv

这是html结构

 

<!-- 客服 -->

<div class="service" id="service">

　　<img src="./images/service.png">

　　<a onclick="onlineService(‘https://kf1.learnsaas.com/chat/chatClient/chatbox.jsp?companyID=967348&amp;configID=71722&amp;jid=6457238263&amp;s=1‘);" style="width: 130px; height: 110px;">

　　　　<img src="./images/onLine_btn.png" id="service_btn">

　　</a>

　　<img src="./images/remove_btn.png" id="remove_service">

　　<p>shaioo86</p>

</div>

 

 

这是js的代码

// 客服浮动

var left_top = 170, right_top = 170, float_list = [], float_side = 5;

$(window).load(function() {

　　// 廳主自改 - 浮動圖V2 -2013.7.19

　　float_list[‘1‘] = $(‘#service‘);

　　for (var i in float_list) {

　　　　if (float_list[i].attr == undefined) {

　　　　continue;

　　}

　　var self = float_list[i],

　　picfloat = (self.attr(‘picfloat‘) == ‘right‘) ? 1 : 0;

　　self.show().Float({‘floatRight‘ : picfloat, ‘topSide‘ : ((picfloat == 1) ? right_top : left_top), side: float_side});

　　}

});