使用 replaceWith 替換節點后,在原來節點上的事件都會被去除。
所以,如果要保留節點上的事件,可以只替換節點內的內容達到目的!不替換已經綁定事件的節點。
.read_box { height:480px; background:#141414; position:absolute; z-index:99999; top:25%; width:80%; left:10%; z-index:-999; /* 要使用scrollbar.js 文件,這個容器就必須設置display為block,不能用js來動態的做。但是在這之後,就可以隨意設置display了! */}.scroll_wrap {position:relative; height:280px; width:80%; margin:0px auto; overflow:hidden; } #dv_scroll { position:absolute; height:700px; width:89%; font-size:14px; font-family:‘创艺繁线体‘; overflow:hidden; padding:20px; } #dv_scroll .Scroller-Container{width:100%;} #dv_scroll_text { word-break: break-all;word-wrap: break-word; color:#6c6c6c; } #dv_scroll_text p { line-height:180%; } #dv_scroll_bar {position:absolute; right:0; top:0px; width:6px; height:310px; background:#484642;} #dv_scroll_bar .Scrollbar-Track{position:absolute; left:0; top:0px; width:6px; height:270px;} #dv_scroll_bar .Scrollbar-Handle{position:absolute;left:0px;top:0; width:6px; height:70px; overflow:hidden;background:#cdc1aa;cursor:pointer;} #dv_scroll_text {position:absolute;} .news_x_content { display:none; }
var oPlay = $(‘#news .play‘); var p_len = oPlay.length; for(var p = 0; p < p_len; p++) { oPlay[p].idx = p; } $(‘.close‘).click(function() { $(‘.read_box‘).fadeOut(‘slow‘); }); $(‘#news .play‘).click(function() { $(‘.read_box .r_title h2‘).html($(‘.news_x_content‘).eq(this.idx).find(‘span‘).html()); $(‘.read_box .r_title h3‘).html($(‘.news_x_content‘).eq(this.idx).find(‘strong‘).html()); $(‘.read_box #dv_scroll_text‘).html($(‘.news_x_content‘).eq(this.idx).find(‘div‘).html()); $(‘.read_box‘).css({‘z-index‘:9999}).fadeIn(‘slow‘); });
<div class="scr_con"> <div id="dv_scroll"> <div id="dv_scroll_text" class="Scroller-Container"> <p>afdsafdsafdsafddsafdsafdsafdsafdsafdsafdsafdsafdsafddsafdsafdsa</p> </div> </div><!--dv_scroll end--> <div id="dv_scroll_bar"> <div id="dv_scroll_track" class="Scrollbar-Track"> <div class="Scrollbar-Handle"></div> <!-- 這個是拖拽條 --> </div> </div><!--dv_scroll_bar end--> </div><!--scr_con end-->
滾動條美化源碼:http://www.divcss5.com/css-texiao/texiao695.shtml
jQuery 節點替換 && DIV 滚动条美化特效
时间: 2024-10-29 20:51:16