• 网页漂浮窗


    设计
    <SCRIPT language=JavaScript src="http://www.cnblogs.com/styles/playpic.js" 
    type=text/JavaScript></SCRIPT>
    <link href="http://www.cnblogs.com/styles/playpic.css" rel="stylesheet" type="text/css" />
    <DIV id=floatImg02 style="Z-INDEX: 66666; LEFT: 80px; POSITION: absolute; TOP: 80px; background-color:transparent">
    <IFRAME style="LEFT: 0px; VISIBILITY: inherit; POSITION: absolute; TOP: 0px;display:none" border=0 src="javascript:false" frameBorder=no width=220 scrolling=no height=120 allowtransparency="true"></IFRAME>
        <SCRIPT language=JavaScript>
                var __areaWidth = 0;
                var __areaHeight = 0;
                var __txtHeight = 0;
                var __txtAlign = "center";
                var __outerBorder = 0;
                var __outerPadding = 0;
                var __picBorder = 0;
                var __picPadding = 0;
                var __distancePicTxt = 0;
                var __txtBorder = 0;
                var __pics = ""
                var __alts = "";
                var __links = "";
                var __texts = "";
                $looptr sql="select top 1 * from(SELECT  (ContentSubject.htmlfilepath+htmlfilename) as vb,Content.url as vd,title,Content.contentid ,Subject.code,createtime,Content.Starttime,Content.Sequence,(select top 1 filepath from Pubattach where tableid =Content.contentID  and  (substring(filename,CHARINDEX('.',filename)+1,3)='jpg' or substring(filename,CHARINDEX('.',filename)+1,3)='png' or substring(filename,CHARINDEX('.',filename)+1,3)='bmp' ) ) as va FROM Subject ,ContentSubject, Content where Subject.id = ContentSubject.SubjectID and ContentSubject.ContentID = Content.contentID and Subject.CODE='cmjjjc_sypf' and Content.Recommend_flag=1) a where va is not null Order by starttime desc, sequence asc,contentid desc"$
                __areaWidth=220;__areaHeight=120;__alts+='|';__pics+='|http://www.cnblogs.com/../..$va$';__links+='|$vd$';__texts+='|';
                $/looptr$
                __pics = __pics.substr(1);
                __alts = __alts.substr(1);
                __links = __links.substr(1);
                __texts = __texts.substr(1);
    try
    {
    
    __imgNewsRoll();
    
    }
    catch(e){}
                            </SCRIPT>
    </DIV>
    
    
     <SCRIPT type=text/javascript>
    try
    {
    var theFloatDiv = document.getElementById("floatImg02");
    var swing = 2;
    var delay = 40;
    var xin = true;
    var yin = true;
    var x = 0;
    var y = 40;
    }catch(e){}
    function floatAD() {
        var w = document.documentElement.clientWidth - theFloatDiv.offsetWidth;
        var h = document.documentElement.clientHeight - theFloatDiv.offsetHeight;
        theFloatDiv.style.left = x + document.documentElement.scrollLeft;
        theFloatDiv.style.top = y + document.documentElement.scrollTop;
        x += swing * (xin ? 1 : -1)
        y += swing * (yin ? 1 : -1)
        if (x > w) { xin = false; }
        if (y > h) { yin = false; }
        if (x < 0) { xin = true; }
        if (y < 0) { yin = true; }
    }
    try{
    var itl = window.setInterval("floatAD()", delay);
    }catch(e){}
    theFloatDiv.onmouseover = function() { try{window.clearInterval(itl);}catch(e){} }
    theFloatDiv.onmouseout = function() { try{itl = window.setInterval("floatAD()", delay);}catch(e){} }
    
    </script>
    playpic.js
    var __adNum=0;
    var __timeOut=4010;
    var __theTimer=0;
    
    var __imgSrc = new Array();
    var __imgAlt = new Array();
    var __imgLink = new Array();
    var __imgText = new Array();
    
    var __isIE = document.all ? true : false;
    
    function __imgNewsRoll()
    {
        __imgSrc = __pics.split("|");
        __imgAlt = __alts.split("|");
        __imgLink = __links.split("|");
        __imgText = __texts.split("|");
    
        document.write ('<div class="lsqOuterLayer" style="border-'+ __outerBorder +'px; padding:'+ __outerPadding +'px; padding-bottom:0px; '+ (__areaWidth - __outerBorder * 2 - __outerPadding * 2) +'px; background-color:transparent">');
        document.write ('<div id="lsqNumLink" style="right:'+ (__outerBorder + __outerPadding + __picBorder + __picPadding + 1) +'px;bottom:'+ (__txtHeight + __distancePicTxt + __outerBorder + __picBorder + __picPadding + 1) +'px; background-color:transparent"><span class="lsqTrans"></span>');
        for(var i=0; i<__imgSrc.length; i++) {
            document.write ('<a title="'+ __imgAlt[i] +'" onfocus="this.blur()" onclick="__playImg('+i+')">'+'</a>');
        }
        document.write ('</div>');
        document.write ('<div id="lsqViewPic" style="border-'+ __picBorder +'px; padding:'+ __picPadding +'px"><a target="_blank"><img border="0" style="'+ (__areaWidth - __outerBorder * 2 - __outerPadding * 2 - __picBorder * 2 - __picPadding * 2) +'px; height:'+ (__areaHeight - __txtHeight - __distancePicTxt - __outerBorder * 2 - __outerPadding - __picBorder * 2 - __picPadding * 2) +'px; background-color:transparent" src="http://images.cnblogs.com/blank.gif"></a></div>');
        document.write ('<div id="lsqViewTxt" style="overflow:hidden; text-align:'+ __txtAlign +'; line-height:'+ (__txtHeight - __txtBorder * 2) +'px; margin-top:'+ __distancePicTxt +'px; border-'+ __txtBorder +'px; height:'+ (__txtHeight - __txtBorder * 2) +'px; background-color:transparent"><a target="_blank"></a></div>');
        document.write ('</div>');
    
        //document.getElementById("lsqViewPic").onmouseover = function () { window.clearTimeout(__theTimer); }
        //document.getElementById("lsqViewPic").onmouseout = function () { __nextAd(); }
    
        __nextAd();
    }
    
    function __nextAd()
    {
        if(__imgLink[__adNum]!="" && __imgLink[__adNum]!="http://")
        {
        document.getElementById("lsqViewPic").childNodes[0].href = __imgLink[__adNum];
        }
        with ( document.getElementById("lsqViewPic").childNodes[0].childNodes[0] )
        {
            src = __imgSrc[__adNum];
            alt = __imgAlt[__adNum];
            if (__isIE) {
                filters.revealTrans.Transition = 23;
                filters.revealTrans.apply();
                filters.revealTrans.play();
            }
        }
            if(__imgLink[__adNum]!="" && __imgLink[__adNum]!="http://")
        {
        document.getElementById("lsqViewTxt").childNodes[0].href = __imgLink[__adNum];
            }
        with ( document.getElementById("lsqViewTxt").childNodes[0] )
        {
            if (__isIE)
                innerText = __imgText[__adNum];
            else
                textContent = __imgText[__adNum];
        }
    
        var __obj = document.getElementById("lsqNumLink").getElementsByTagName("A");
        for (var i=0; i<__obj.length; i++) __obj[i].className = "";
        __obj[__adNum].className = "clk";
    
        __adNum++;
        if (__adNum >= __imgSrc.length) __adNum = 0;
    
        __theTimer = window.setTimeout("__nextAd()", __timeOut)
    }
    
    function __playImg(i)
    {
        window.clearTimeout(__theTimer);
        __adNum = i;
        __nextAd()
    }
    playpic.css
    DIV.lsqOuterLayer {
        BORDER-LEFT-COLOR: #c0c0c0; BORDER-BOTTOM-COLOR: #c0c0c0; BORDER-TOP-STYLE: solid; BORDER-TOP-COLOR: #c0c0c0; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; POSITION: relative; BACKGROUND-COLOR: #ffffff; BORDER-RIGHT-COLOR: #c0c0c0; BORDER-BOTTOM-STYLE: solid
    }
    DIV.lsqOuterLayer DIV#lsqNumLink {
        PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FILTER: progid:DXImageTransform.Microsoft.Alpha(startX=0, startY=0, finishX=100, finishY=100,style=1,opacity=0,finishOpacity=90); PADDING-BOTTOM: 3px; WIDTH: 70%; PADDING-TOP: 3px; POSITION: absolute; BACKGROUND-COLOR: #fff; TEXT-ALIGN: right
    }
    DIV.lsqOuterLayer DIV#lsqNumLink SPAN.lsqTrans {
        FILTER: revealTrans(duration=1,transition=5)
    }
    DIV.lsqOuterLayer DIV#lsqNumLink A {
        PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-SIZE: 10px; BORDER-LEFT: #fff 1px solid; CURSOR: pointer; COLOR: #fff; FONT-FAMILY: Arial; BACKGROUND-COLOR: #000
    }
    DIV.lsqOuterLayer DIV#lsqNumLink A.clk {
        BACKGROUND-COLOR: #f00
    }
    DIV.lsqOuterLayer DIV#lsqViewPic {
        BORDER-LEFT-COLOR: #c0c0c0; BORDER-BOTTOM-COLOR: #c0c0c0; BORDER-TOP-STYLE: solid; BORDER-TOP-COLOR: #c0c0c0; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-RIGHT-COLOR: #c0c0c0; BORDER-BOTTOM-STYLE: solid
    }
    DIV.lsqOuterLayer DIV#lsqViewPic IMG {
        FILTER: revealTrans(duration=1,transition=5)
    }
    DIV.lsqOuterLayer DIV#lsqViewTxt {
        BORDER-LEFT-COLOR: #c0c0c0; BORDER-BOTTOM-COLOR: #c0c0c0; OVERFLOW: hidden; BORDER-TOP-STYLE: solid; BORDER-TOP-COLOR: #c0c0c0; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-RIGHT-COLOR: #c0c0c0; BORDER-BOTTOM-STYLE: solid
    }
    DIV.lsqOuterLayer DIV#lsqViewTxt A {
        COLOR: #090909
    }
  • 相关阅读:
    JS函数节流
    JS中多种方式创建对象
    javascript的几种继承
    多进程基本概念
    APUE(1)——UNIX基本概念
    pthread
    使用TortoiseGit,设置ssh方式连接git仓库。
    mac系统下用ssh方式连接git仓库
    webstorm2017.02版本如何使用material theme
    谷歌浏览器的字体问题
  • 原文地址:https://www.cnblogs.com/652769324qq/p/3028362.html
Copyright © 2020-2023  润新知