新浦京81707con > 功能介绍 > 百度留言本js,实例代码

原标题:百度留言本js,实例代码

浏览次数:132 时间:2019-09-13

不久前要促成贰个轮转音讯效果,在互连网查了部分素材,开采基本的兑现格局有二种:

复制代码 代码如下:

1.使用Marquee标签。这几个标签的施用本身早已转发了一篇比较详细的稿子,那些标签的优点是便利使用,短处是人人曾经稳步不适用它了,好多浏览器不支持,以至在IE8想,XHTML4.0的loose.dtd是足以的,而去掉loose.dtd而不是凡。

window.onresize = baiduResizeDiv;
window.onerror = function(){}
var divTop,divLeft,divWidth,divHeight,docHeight,docWidth,objTimer,i = 0;
var px = document.doctype?"px":0;
var scrollwidth = navigator.userAgent.indexOf("Firefox")>0?16:0;
var iframeheight = navigator.userAgent.indexOf("MSIE")>0?170-2:209-2;
String.prototype.Trim = function(){return this.replace(/^s |s $/g,"");}
function baidu_collapse(obj){
ct = document.getElementById('tab_c_iframe');
if(ct.style.display=="none"){
ct.style.display="";
obj.src=obj.src.replace("b.gif","a.gif");
} else {
ct.style.display="none";
obj.src=obj.src.replace("a.gif","b.gif");
}
baiduResizeDiv();
}

2.使用div javascript的方法。这种艺术的裨益是足以匹配大致全数的浏览器,而且在能够预想的时光内还能平安运维。而且选取div使得网页能够利用现存的css能源完毕广大炫丽的成效。劣势是急需确定的编制程序经验和耐心。

function baiduMsg()
{
try{
divTop = parseInt(document.getElementById("eMeng").style.top,10);
divLeft = parseInt(document.getElementById("eMeng").style.left,10);
divHeight = parseInt(document.getElementById("eMeng").offsetHeight,10);
divWidth = parseInt(document.getElementById("eMeng").offsetWidth,10);

利用javascript div情势的基本原理是同样的,利用scrollTop属性和offsetheight属性来兑现移动效果。一般接纳多个div,里面的从头到尾的经过是一致的,然后采用四个div拼接,形成持续循环的法力。上边是笔者找到的两份演示代码,第一份正是小编用的代码,可以运作。第二份本人没做测量检验。写出来是为着做个相比较,第二份应该是能用的,因为那是本身从网址上摘下来的。

var scrollPosTop,scrollPosLeft,docWidth,docHeight;
if (typeof window.pageYOffset != 'undefined') {
scrollPosTop = window.pageYOffset;
scrollPosLeft = window.pageXOffset;
docWidth = window.innerWidth;
docHeight = window.innerHeight;
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scrollPosTop = document.documentElement.scrollTop;
scrollPosLeft = document.documentElement.scrollLeft;
docWidth = document.documentElement.clientWidth;
docHeight = document.documentElement.clientHeight;
} else if (typeof document.body != 'undefined') {
scrollPosTop = document.body.scrollTop;
scrollPosLeft = document.body.scrollLeft;
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
}

先是份代码

document.getElementById("eMeng").style.top = parseInt(scrollPosTop,10) docHeight 10 px;// divHeight
document.getElementById("eMeng").style.left = parseInt(scrollPosLeft,10)

复制代码 代码如下:

  • docWidth - divWidth - scrollwidth px;
    document.getElementById("eMeng").style.visibility="visible";
    objTimer = window.setInterval("baidu_move_div()",10);
    }catch(e){}
    }

<div id="layer1" style="overflow-y:hidden;width:120;">
            <div id="layer2">
                <%
                ArrayList announceList = DBTools.getView("select * from sys_announce order by pubdate DESC");
                for (int i = 1; i < announceList.size() && i < 5; i ) {
                    String announceArr[] = (String[]) announceList.get(i);
                    String content = announceArr[1];
                    String date = announceArr[2].substring(announceArr[2].indexOf("-") 1, announceArr[2].indexOf(" "));
                %>
                    <table cellspacing="0" cellpadding="0" border="0" width="43">
                        <tr>
                            <td height="10"/>
                        </tr>
                    </table>
                    <table cellspacing="0" cellpadding="0" border="0" width="136">
                        <tr>
                            <td height="20" width="16" valign="top">
                                <img height="12" width="12" vspace="5" valign="top" src="images/index_18.gif" mce_src="images/index_18.gif"/>
                            </td>
                            <td width="108" style="line-height: 20px;" mce_style="line-height: 20px;">
                                <%=content%>  <%=date%>
                            </td>
                            <td></td>
                        </tr>
                    </table>
                <%
                }
                %>
            </div>
            <div id="layer3"></div>
        </div>
        <mce:script language="javascript"><!--
            var layerHeight = 100; // 定义滚动区域的中度.100
            var iFrame = 1; // 定义每帧移动的象素.
            var iFrequency = 50; // 定义帧频率.
            var timer; // 定义时间句柄.
            if(document.getElementById("layer2").offsetHeight >= layerHeight)
                document.getElementById("layer1").style.height = layerHeight;
            else
                document.getElementById("layer1").style.height = document.getElementById("layer2").offsetHeight;
            document.getElementById("layer3").innerHTML = document.getElementById("layer2").innerHTML;
            // alert(document.getElementById("layer2").innerHTML);
            function move(){
                if(document.getElementById("layer1").scrollTop >= document.getElementById("layer2").offsetHeight){
                    document.getElementById("layer1").scrollTop -= (document.getElementById("layer2").offsetHeight - iFrame);
                }
                else {
                    document.getElementById("layer1").scrollTop = iFrame;
                }
            }
            timer = setInterval("move()",iFrequency);
            document.getElementById("layer1").onmouseover=function() {clearInterval(timer);}
            document.getElementById("layer1").onmouseout=function() {timer=setInterval("move()",iFrequency);}

function baiduResizeDiv()
{
i =1;
try{
divHeight = parseInt(document.getElementById("eMeng").offsetHeight,10);
divWidth = parseInt(document.getElementById("eMeng").offsetWidth,10);

// --></mce:script>

var scrollPosTop,scrollPosLeft,docWidth,docHeight;
if (typeof window.pageYOffset != 'undefined') {
scrollPosTop = window.pageYOffset;
scrollPosLeft = window.pageXOffset;
docWidth = window.innerWidth;
docHeight = window.innerHeight;
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scrollPosTop = document.documentElement.scrollTop;
scrollPosLeft = document.documentElement.scrollLeft;
docWidth = document.documentElement.clientWidth;
docHeight = document.documentElement.clientHeight;
} else if (typeof document.body != 'undefined') {
scrollPosTop = document.body.scrollTop;
scrollPosLeft = document.body.scrollLeft;
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
}

本文由新浦京81707con发布于功能介绍,转载请注明出处:百度留言本js,实例代码

关键词: 新浦京81707con

上一篇:解决Extjs4中form表单提交后无法进入success函数问题

下一篇:没有了