网页漂浮窗

设计
<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-width:'+ __outerBorder +'px; padding:'+ __outerPadding +'px; padding-bottom:0px; width:'+ (__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-width:'+ __picBorder +'px; padding:'+ __picPadding +'px"><a target="_blank"><img border="0" style="width:'+ (__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-width:'+ __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
}

 

posted @ 2013-04-18 14:21  梅香萦绕,佳人依偎  阅读(189)  评论(0编辑  收藏  举报