javascript 效果收集

ian_jiang

浏览: 45838 次
性别:
来自: 西安

最近访客更多访客>>

cooperay

autumnSky813

lonfee

likoaong

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

[13]script

JavaScript CSS Go Security 浏览器

滚动广告效果：

<%@page contentType="text/html; charset=utf-8"%>
<form name="vendors">
<table width="950" height="76" background="/images/090716_index/partner_bg.jpg"
		 cellspacing="0" cellpadding="0" style="font-size: 12px;">
	<tr onmouseout="startV();" onmouseover="stopV();">
		<td width="18">
			<img src="/images/090716_index/partner_left_btn.jpg" 
					border="0" style="cursor: pointer;" onclick="previous();">
		</td>
		<td width="888" align="center">
			<div id="outDemo" style="width: 888px;overflow: hidden;">
				<div id = "innDemo" style="width: <%=divWidth %>px;">
					<div name="vendor" id="<%=tagID%>" style="<%=relStyle %>">
						<img src="<%=filePath%>" border="0"
						style="width: 137px; height: 60px;" />
					</div>
				</div>
			</div>
		</td>
		<td width="18">
			<img src="/images/090716_index/partner_right_btn.jpg" border="0" 
					style="cursor: pointer;" onclick="next();">
		</td>
	</tr>
</table>
</form>
<script type="text/javascript">
/*******************/
var timer = "";
var interval = 20;
var cellWidth = 149;
var padding = 10;
var demo = document.getElementById("outDemo");
var demo1 = document.getElementById("innDemo");
var resetLeft = 745;
var paddingLeft = 
	parseInt(demo1.style.width) - parseInt(demo.style.width) - padding;
demo1.innerHTML += demo1.innerHTML;

function stopV(){
	if("" != timer){
		clearInterval(timer);
		timer="";
	}
}

function startV(){
	if("" == timer){
		go();
	}
}
 
function move(){
    demo.scrollLeft = 
        demo.scrollLeft==paddingLeft?resetLeft:demo.scrollLeft+1;  
}  
function go(){  
 timer = setInterval(move,interval);  
}

function next() {
	var x = 
		demo.scrollLeft%cellWidth != 0 ?
				parseInt(demo.scrollLeft/cellWidth)+1 : 
					 parseInt(demo.scrollLeft/cellWidth);
	demo.scrollLeft = demo.scrollLeft>paddingLeft?1:(x*cellWidth)+padding; 
}

function previous() {
	var y = demo.scrollLeft%cellWidth != 0 ? 
			parseInt(demo.scrollLeft/cellWidth) :
				 parseInt(demo.scrollLeft/cellWidth)-1;
	demo.scrollLeft = demo.scrollLeft<1?paddingLeft:(y*cellWidth);
}

window.onload = go;

/*******************/
</script>

Css 选项卡：

<html>
<head>
    <style type="text/css">
        <!--
        /*- Menu Tabs J--------------------------- */

            #tabsJ {
              float:left;
              width:100%;
              background:#F4F4F4;
              font-size:93%;
              line-height:normal;
              border-bottom:1px solid #24618E;
              }
            #tabsJ ul {
                margin:0;
                padding:10px 10px 0 50px;
                list-style:none;
              }
            #tabsJ li {
              display:inline;
              margin:0;
              padding:0;
              }
            #tabsJ a {
              float:left;
              background:url("../Images/tableftJ.gif") no-repeat left top;
              margin:0;
              padding:0 0 0 5px;
              text-decoration:none;
              }
            #tabsJ a span {
              float:left;
              display:block;
              background:url("../Images/tabrightJ.gif") no-repeat right top;
              padding:5px 15px 4px 6px;
              color:#24618E;
              }
            /* Commented Backslash Hack hides rule from IE5-Mac \*/
            #tabsJ a span {float:none;}
            /* End IE5-Mac hack */
            #tabsJ a:hover span {
              color:#FFF;
              }
            #tabsJ a:hover {
              background-position:0% -42px;
              }
            #tabsJ a:hover span {
              background-position:100% -42px;
              }

            #tabsJ #current a {
                    background-position:0% -42px;
            }
            #tabsJ #current a span {
                    background-position:100% -42px;
                    color:#FFF;
            }
        -->
    </style>
</head>
<body>
<div id="tabsJ">
<ul>
<li id="current"><a href="#"><span>A</span></a></li>
<li><a href="#"><span>B</span></a></li>
<li><a href="#"><span>C</span></a></li>
</ul>
</div>
</body>
</html>

添加收藏和设为首页：

    <script language="javascript" type="text/javascript">
          var strHref=window.location.href;
          var title = "XXXX - " + window.document.title;
          
          function addCookie() {　 // 加入收藏
　　　　　　　 if (document.all) {
　　　　　　　　　　　 window.external.addFavorite(strHref, title);
　　　　　　　 }
　　　　　　　 else if (window.sidebar) {
　　　　　　　 window.sidebar.addPanel(title,strHref, "");
　　　　　　　 }
　　　　  }　　　　　　　 
　　　　  function setHomepage(){　 // 设为首页
　　　　　     if (document.all){
　　　　　          document.body.style.behavior = 'url(#default#homepage)';
　　　　　　        document.body.setHomePage(strHref);　　　　　　　　　　　 
　　　　　　   }
　　　　　　   else if (window.sidebar) {
　　　　　          if (window.netscape) {
　　　　　　　          try {
　　　　　　　　            netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
　　　　　　　          }
　　　　　　　          catch (e) {
　　　　　　　　            alert("该操作被浏览器拒绝，假如想启用该功能，请在地址栏内输入 about:config,然后将项 signed.applets.codebase_principal_support 值该为true");
　　　　    　　        }
　　　　　　        }
　　　　　　        var prefs = Components.classes['@mozilla.org/preferences-service;1'].getService(Components.interfaces.nsIPrefBranch);
　　　　　　        prefs.setCharPref('browser.startup.homepage',strHref);
　　　　　　   }
　　　　 }
    </script>

分享到：