- 積分
- 5063
- 威望
- 5063
- 金錢
- 2873
- 最後登錄
- 2024-3-27
|
本帖最後由 无界 於 2014-1-12 13:43 編輯
多格下效果:
PS:在xshow的title.js基础上加背景和圆角及背景色。
标签文字颜色受风格页脚文字色影响,大家也可以拷贝showpop.htm内容放到自己论坛进行背景及底色修改。
修改方法:将下边代码放在第三方即可。- <script type="text/javascript" src="http://tlb.258club.com/templates/default/showpop.htm"></script>
複製代碼 预览地址:http://tlb.258club.com/
背景图片:
代码内容:- var sPop = null;
- var pltsoffsetX = 10;
- var pltsoffsetY = 15;
- document.write('\
- <style type="text/css"> \
- #popLayer { \
- position:absolute; \
- Z-INDEX: 1000; \
- text-align : left; \
- white-space: nowrap; \
- font-family: 浪漫雅圆,微软雅黑,Tahoma, Verdana; \
- visibility: hidden; \
- border-radius: 8px; \
- background: url(背景图片地址) no-repeat; \
- background-color:#80C8FF; \
- } \
- </style> \
- <div id="popLayer" class="popupmenu_popup" nowrap></div> \
- ');
- function showPopupText(event) {
- try {
- o = event.srcElement ? event.srcElement : event.target;
- if (o.alt != null && o.alt != '') { o.pop = o.alt; o.alt = ''; }
- if (o.title != null && o.title != '') { o.pop = o.title; o.title = ''; }
- if (o.pop != sPop) {
- sPop = o.pop;
- if (sPop == null || sPop == '') {
- $('popLayer').style.visibility = 'hidden';
- $('popLayer').innerHTML = '';
- } else {
- $('popLayer').style.visibility = 'visible';
- $('popLayer').innerHTML = sPop.replace(/<(.*)>/g, "<$1>").replace(/\n/g, '<br />');
- moveToMouseLoc(event);
- }
- }
- } catch (e) {
- return true;
- }
- }
- function moveToMouseLoc(event){
- try {
- if ($('popLayer').innerHTML == '') return true;
- var MouseX = event.clientX;
- var MouseY = event.clientY;
- var popHeight = $('popLayer').offsetHeight;
- var popWidth = $('popLayer').offsetWidth;
- if (MouseY + pltsoffsetY + popHeight > document.documentElement.clientHeight - 10) {
- popTopAdjust =- popHeight - pltsoffsetY * 1.5;
- } else {
- popTopAdjust = 0;
- }
- if (MouseX + pltsoffsetX + popWidth > document.documentElement.clientWidth - 10) {
- popLeftAdjust =- popWidth - pltsoffsetX * 2;
- } else {
- popLeftAdjust = 0;
- }
- var pleft = MouseX + pltsoffsetX + document.documentElement.scrollLeft + popLeftAdjust;
- var ptop = MouseY + pltsoffsetY + document.documentElement.scrollTop + popTopAdjust;
- $('popLayer').style.left = (pleft > 5 ? pleft : 5) + 'px';
- $('popLayer').style.top = (ptop > 5 ? ptop : 5) + 'px';
- return true;
- } catch (e) {
- return true;
- }
- }
- if (!document.onmouseover) {
- document.onmouseover = function(e) {
- !e ? showPopupText(window.event) : showPopupText(e);
- };
- }
複製代碼 |
-
2
評分人數
-
|