预览模式: 普通 | 列表

【效果】精辟的抖动效果

作者:青锋幽灵 日期:2008-12-02 10:53

XML/HTML代码
  1. <img id="win" style='position:relative' src="http://ghost.cmsdream.com/samples/quake/img.jpg"><br /><br />     
  2. <button onclick="quake()">振动</button>     
  3. <script type="text/javascript">     
  4. var a=['top','left'],b=0;      
  5. function quake(u){      
  6.     u=setInterval(function(){      
  7.         document.getElementById('win').style[a[b%2]]=(b++)%4<2?0:4;      
  8.         if(b>15){clearInterval(u);b=0}      
  9.     },32);      
  10. }      
  11. </script>  

预览效果

类别: Javascript | 引用: 0 | 评论: 0 | 阅读: 95 | 打印 | 打包

完美js模拟网页对话框效果(可拖曳)

作者:青锋幽灵 日期:2008-10-23 10:51

JavaScript代码
  1. /**  
  2.     Powered By CMSDream Copyright © 2007-2008 All rights reserved.  
  3.     23:25 2008-5-3  
  4. **/  
  5. var msgbox_scripts = document.getElementsByTagName("script");   
  6. msgbox_path = msgbox_path.substring(0, msgbox_path.lastIndexOf('/')+1);   
  7.   
  8. var CMSMsgBox = function(oWidth, oHeight, oSkin, oTitle){   
  9.     this.Id = 'msgbox_'+Math.random().toString().replace('\.', '_');   
  10.     /*  
  11.      * 位置  
  12.      * =================  
  13.      * ===== 1 2 3 =====  
  14.      * ===== 4 5 6 =====  
  15.      * ===== 7 8 9 =====  
  16.      * =================  
  17.      */  
  18.     this.Position = 5;   
  19.   
  20.     this.Skin = oSkin || 'default';   
  21.     this.Width = oWidth || 500;   
  22.     this.Height = oHeight || 260;   
  23.        
  24.     this.Title = oTitle || 'CMSDream:';   
  25.     this.Value = '';   
  26.     this.Float = true;   
  27.     this.Mask = false;   
  28.     this.Drag = true;   
  29.     this.Return = false;   
  30.     this.BoxDiv = null;   
  31. };   
  32.   
  33. CMSMsgBox.prototype.show = function(){   
  34.     /* 加载样式表 */  
  35.     if(!this.$('msgbox_styles')){   
  36.         var css = document.createElement('link');   
  37.         css.setAttribute('href', msgbox_path + 'msgbox.css');   
  38.         css.setAttribute('id', 'msgbox_styles');   
  39.         css.setAttribute('rel', 'stylesheet');   
  40.         css.setAttribute('type', 'text/css');   
  41.         document.getElementsByTagName('head')[0].appendChild(css);   
  42.     }   
  43.     if(this.$(this.Id))return false;   
  44.     this.Return = true;   
  45.     this.BoxDiv = this.createDiv(document.body, 'div', 'block', this.Id, 'msgbox_main_div');       
  46.     if(this.Mask)this.createMask();    
  47.     this.showBox();   
  48. };   
  49.   
  50. CMSMsgBox.prototype.showBox = function(){   
  51.     var self = this;   
  52.     var div = new Array();   
  53.        
  54.     div['box'] = this.createDiv(this.BoxDiv, 'div', 'block', this.Id+'bgcolor_div', 'msgbox_box msgbox_box_'+this.Skin);   
  55.     if(this.Width)div['box'].style.width = this.Width+'px';   
  56.     if(this.Height && this.Skin != 'loading')div['box'].style.height = this.Height+'px';   
  57.        
  58.     div['title'] = this.createDiv(div['box'], 'div', null, null, 'msgbox_title');   
  59.   
  60.     /* =====================================  
  61.      * 拖曳效果  
  62.      *=====================================**/  
  63.     if(this.Drag){   
  64.         div['move'] = this.createDiv(this.BoxDiv, 'div', 'none', null, 'msgbox_move_div');         
  65.         div['title'].style.cursor = 'move';   
  66.         div['title'].onmousedown = function(e){   
  67.             var X = document.all ? event.clientX : e.pageX;   
  68.             var Y = document.all ? event.clientY : e.pageY;   
  69.             var T = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;   
  70.             var cLeft = div['code'].offsetLeft + div['box'].offsetLeft;   
  71.             var cTop = div['code'].offsetTop + div['box'].offsetTop - T;   
  72.             if((X > cLeft && X < (cLeft + div['code'].offsetWidth)) && (Y > cTop && Y < (cTop + div['code'].offsetHeight)))   
  73.             return;   
  74.             this.style.zIndex += 10;       
  75.             this.setAttribute('MD', '1');   
  76.             this.setAttribute('XCX', parseInt(X - div['box'].offsetLeft).toString());   
  77.             this.setAttribute('XCY', parseInt(Y - div['box'].offsetTop).toString());   
  78.             div['move'].style.width = parseInt(div['box'].offsetWidth-10) + 'px';   
  79.             div['move'].style.height = parseInt(div['box'].offsetHeight - 10) + 'px';   
  80.             div['move'].style.left = div['box'].offsetLeft + 'px';   
  81.             div['move'].style.top = div['box'].offsetTop + 'px';   
  82.             div['move'].style.display = 'block';   
  83.         };   
  84.         document.onmousemove = function(e){   
  85.             if(div['title'].getAttribute('MD')!='1')return;   
  86.             var XCX = div['title'].getAttribute('XCX');   
  87.             var XCY = div['title'].getAttribute('XCY');   
  88.             var X = document.all ? event.clientX : e.pageX;   
  89.             var Y = document.all ? event.clientY : e.pageY;   
  90.             div['move'].style.left = parseInt(X - XCX) + 'px';   
  91.             div['move'].style.top = parseInt(Y - XCY) + 'px';   
  92.         };   
  93.         document.onmouseup = function(e){   
  94.             if(div['title'].getAttribute('MD')!='1')return;   
  95.             div['title'].setAttribute('MD', '0');   
  96.             div['title'].setAttribute('XCX', '0');   
  97.             div['title'].setAttribute('XCY', '0');   
  98.             div['box'].style.left = div['move'].offsetLeft + 'px';   
  99.             div['box'].style.top = div['move'].offsetTop + 'px';   
  100.             if(self.IsObject(div['mask'])){   
  101.                 div['mask'].style.left = div['move'].offsetLeft + 'px';   
  102.                 div['mask'].style.top = div['move'].offsetTop + 'px';   
  103.             }      
  104.             div['move'].style.display = 'none';   
  105.         };   
  106.     }   
  107.     div['span'] = this.createDiv(div['title'], 'span', 'block', this.Id+'_msgTitle');   
  108.     div['span'].innerHTML = this.Title;   
  109.   
  110.     /* =====================================  
  111.      * 关闭按钮  
  112.      *=====================================**/  
  113.     div['code'] = this.createDiv(div['title'], 'code', 'block');   
  114.     div['code'].setAttribute('title', 'close');   
  115.     div['code'].style.position = 'relative';   
  116.     div['code'].innerHTML = "close";   
  117.     div['code'].onclick = function(){self.close();};   
  118.        
  119.     /* =====================================  
  120.      * 文本区域  
  121.      *=====================================**/  
  122.     div['text'] = this.createDiv(div['box'], 'div', 'block', this.Id+'_msgContent', 'msgbox_content');   
  123.     div['value'] = this.createDiv(div['text'], 'div', 'block', this.Id+'_msgValue', 'msgbox_container');   
  124.     div['clear'] = this.createDiv(div['text'], 'div', 'block', null, 'msgbox_clear');   
  125.     if(this.Height && this.Skin != 'loading'){   
  126.         div['value'].style.height = (div['box'].offsetHeight - div['title'].offsetHeight - 16) + 'px';   
  127.         div['value'].style.overflowY = 'auto';   
  128.     }   
  129.     div['value'].innerHTML = this.Value;   
  130.   
  131.     /* =====================================  
  132.      * 创建一个iframe档住select   
  133.      *=====================================**/  
  134.     if(document.all && !this.Mask){   
  135.         div['mask'] = this.createDiv(this.BoxDiv, 'iframe', 'block', null, 'msgbox_frame');   
  136.         div['mask'].style.width = div['box'].offsetWidth+'px';   
  137.         div['mask'].style.height = div['box'].offsetHeight+'px';   
  138.     }      
  139.        
  140.        
  141.     mDiv_Float();      
  142.     if(this.Float){   
  143.         if(window.addEventListener){   
  144.             window.addEventListener('resize', mDiv_Float, false);   
  145.             window.addEventListener('scroll', mDiv_Float, false);   
  146.         }else{   
  147.             window.attachEvent('onresize', mDiv_Float);   
  148.             window.attachEvent('onscroll', mDiv_Float);   
  149.         }   
  150.     }   
  151.   
  152.     /* =====================================  
  153.      * 漂浮效果  
  154.      *=====================================**/  
  155.     function mDiv_Float(){   
  156.         var t = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;   
  157.         var h = document.documentElement.clientHeight ? Math.min(document.documentElement.clientHeight, document.body.clientHeight) : document.body.clientHeight;   
  158.         var w = document.documentElement.clientWidth ? document.documentElement.scrollWidth : document.body.scrollWidth;   
  159.            
  160.         switch(self.Position){   
  161.             case 1:  {var l = 1;var r = t + 1;break;}   
  162.             case 2:  {var l = parseInt((w/2)-(div['box'].offsetWidth/2));var r = t + 1;break;}   
  163.             case 3:  {var l = parseInt(w-div['box'].offsetWidth-1);var r = t + 1;break;}   
  164.             case 4:  {var l = 1;var r = parseInt(t+((h/2)-(div['box'].offsetHeight/2)));break;}   
  165.             case 5:  {var l = parseInt((w/2)-(div['box'].offsetWidth/2));var r = parseInt(t+((h/2)-(div['box'].offsetHeight/2)));break;}   
  166.             case 6:  {var l = parseInt(w-div['box'].offsetWidth-1);var r = parseInt(t+((h/2)-(div['box'].offsetHeight/2)));break;}   
  167.             case 7:  {var l = 1;var r = parseInt(t+(h-div['box'].offsetHeight-1));break;}   
  168.             case 8:  {var l = parseInt((w/2)-(div['box'].offsetWidth/2));var r = parseInt(t+(h-div['box'].offsetHeight-1));break;}   
  169.             case 9:  {var l = parseInt(w-div['box'].offsetWidth-1);var r = parseInt(t+(h-div['box'].offsetHeight-1));break;}   
  170.             default: {var l = parseInt((w/2)-(div['box'].offsetWidth/2));var r = parseInt(t+((h/2)-(div['box'].offsetHeight/2)));break;}   
  171.         }   
  172.            
  173.         div['box'].style.left = l+'px';   
  174.         div['box'].style.top = r+'px';   
  175.         if(document.all && !self.Mask){   
  176.             div['mask'].style.left = l+'px';   
  177.             div['mask'].style.top = r+'px';   
  178.         }   
  179.     }   
  180. };   
  181.   
  182. /* 蒙板 */  
  183. CMSMsgBox.prototype.createMask = function(){   
  184.     var self = this;   
  185.     var div = new Array(1);   
  186.     if(document.all)   
  187.     div['mask_ifr'] = this.createDiv(this.BoxDiv, 'iframe', 'block', null, 'msgbox_mask_frame');   
  188.     div['mask_div'] = this.createDiv(this.BoxDiv, 'div', 'block', null, 'msgbox_mask_div');   
  189.        
  190.     function window_onresize(){   
  191.         var h = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);           
  192.         var w = document.all ? Math.min(document.documentElement.scrollWidth, document.body.scrollWidth) :    
  193.                 Math.max(document.documentElement.scrollWidth, document.body.scrollWidth);   
  194.            
  195.         div['mask_div'].style.width = w + 'px';   
  196.         div['mask_div'].style.height = h + 'px';   
  197.         if(document.all){   
  198.             div['mask_ifr'].style.width = div['mask_div'].offsetWidth + 'px';   
  199.             div['mask_ifr'].style.height = div['mask_div'].offsetHeight + 'px';   
  200.         }   
  201.     }   
  202.        
  203.     if(window.addEventListener){   
  204.         window.addEventListener('scroll', window_onresize, false);   
  205.         window.addEventListener('resize', window_onresize, false);   
  206.     }else{   
  207.         window.attachEvent('onscroll', window_onresize);   
  208.         window.attachEvent('onresize', window_onresize);   
  209.     }   
  210.     if(this.Skin=='loading')div['mask_div'].ondblclick = function(){self.close();};   
  211.     window_onresize();   
  212. };   
  213.   
  214. /* 创建一个元素  */  
  215. CMSMsgBox.prototype.createDiv = function(iParent, element, display, id, clsname){   
  216.     var ii = document.createElement(element);   
  217.     if(typeof(display)=='string')ii.style.display = display;   
  218.     if(typeof(clsname)=='string')ii.className = clsname;   
  219.     if(typeof(id)=='string')ii.setAttribute('id', id);   
  220.     iParent.appendChild(ii);   
  221.     return ii;   
  222. };   
  223.   
  224. /* 关闭 */  
  225. CMSMsgBox.prototype.close = function(){    
  226.     if(this.IsObject(this.BoxDiv) && this.BoxDiv.parentNode){   
  227.         this.BoxDiv.parentNode.removeChild(this.BoxDiv);   
  228.     }   
  229. };   
  230.   
  231. CMSMsgBox.prototype.$ = function(o){   
  232.     return document.getElementById(o);   
  233. };   
  234.   
  235. CMSMsgBox.prototype.IsObject = function(o){   
  236.     return typeof(o)!='undefined' && o!=null;   
  237. };   
  238.   
  239. CMSMsgBox.prototype.setBackgroundColor=function(iColor){   
  240.     if(!this.$(this.Id+'bgcolor_div'))return;   
  241.     this.$(this.Id+'bgcolor_div').style.backgroundColor = iColor;   
  242. };   
  243.   
  244. CMSMsgBox.prototype.setColor=function(iColor){   
  245.     if(!this.$(this.Id+'_msgValue'))return;   
  246.     this.$(this.Id+'_msgValue').style.color = iColor;   
  247. };   
  248.   
  249. CMSMsgBox.prototype.setValue=function(iValue){   
  250.     if(!this.$(this.Id+'_msgValue'))return;   
  251.     this.$(this.Id+'_msgValue').innerHTML = iValue;   
  252. };   
  253.   
  254. CMSMsgBox.prototype.setTitle=function(iTitle){   
  255.     if(!this.$(this.Id+'_msgTitle'))return;   
  256.     this.$(this.Id+'_msgTitle').innerHTML = iTitle;   
  257. };  

效果图片：

效果预览

下载源代码

类别: Javascript | 引用: 0 | 评论: 0 | 阅读: 176 | 打印 | 打包

图片连续滚动(缓冲，一停一顿效果)，可左右翻滚

作者:青锋幽灵 日期:2008-09-12 10:31

样式表代码（scroll.css）：

CSS代码
  1. * {margin:0;padding:0;}   
  2. body {width:370px;}   
  3. a {text-decoration:none;color:#000;}   
  4. a:hover {text-decoration:underline;color:#f00;}   
  5. ul,li {float:left;width:100%;list-style-type:none;}   
  6. h3,h3 a {font-size:12px;font-weight:normal;font-family:"宋体",Verdana;}   
  7.   
  8. .bc {height:90px;clear:both;overflow:hidden;padding:3px 15px 0 15px;}   
  9. .bc a.scroll {width:12px;height:46px;overflow:hidden;text-indent:-100px;margin-top:5px;background:#333;}   
  10. .bc a.s1 {float:left;}   
  11. .bc a.s2 {float:rightright;}   
  12.   
  13. #scroll1 {padding:5px 8px 7px 8px;}   
  14. .bc div.scroll {float:left;position:relative;width:318px;left:6px;overflow:hidden;}   
  15.        
  16. div.scroll ul {width:8000%;}   
  17. div.scroll ul li {width:106px;padding:0 0 2px 0;text-align:center;}   
  18. div.scroll ul li img {clear:both;width:90px;height:60px;border:1px solid #ccc;margin:0 auto;}   
  19. div.scroll ul li h3 {height:20px;line-height:20px;overflow:hidden;}   
  20. div.scroll ul li h3,div.scroll ul li h3 a {color:#c00;font-family:"宋体";}  

效果JS代码（scroll.js）：

JavaScript代码
  1. function scroll_initialize(Id){   
  2.     var self    =this;   
  3.     var obj     = document.getElementById(Id);   
  4.     if(obj.getElementsByTagName('li').length==0)return;   
  5.     var links   = obj.getElementsByTagName('a');   
  6.     var a       = links[0];   
  7.     var b       = links[links.length-1];       
  8.     var ul      = obj.getElementsByTagName('ul')[0];   
  9.     var div     = obj.getElementsByTagName('div')[0];   
  10.         
  11.     var li_width    = obj.getElementsByTagName('li')[0].offsetWidth;   
  12.     var li_count    = obj.getElementsByTagName('li').length;   
  13.     var ul_width    = li_width * li_count;   
  14.        
  15.     this.speed      = 2000;   
  16.     this.mar        = null;   
  17.   
  18.     this.doSlide = function(n,t,d,c){   
  19.         var timers=new Array(n);   
  20.         var x=div.scrollLeft;   
  21.         for(var i=0;i<n;i++)(function(){   
  22.             if(timers[i]) clearTimeout(timers[i]);   
  23.             var j=i;   
  24.             timers[i]=setTimeout(function(){   
  25.                 if(d==0){   
  26.                     if(ul_width-div.scrollLeft<=0){   
  27.                         div.scrollLeft-=ul_width;   
  28.                     }else{             
  29.                         div.scrollLeft=x+Math.round((c*li_width)*Math.sin(Math.PI*(j+1)/(2*n)));   
  30.                     }   
  31.                 }else{   
  32.                     if(div.scrollLeft<=0){   
  33.                     }else{             
  34.                         div.scrollLeft=x-Math.round((c*li_width)*Math.sin(Math.PI*(j+1)/(2*n)));   
  35.                     }   
  36.                 }   
  37.             },(i+1)*t);   
  38.         })();   
  39.   
  40.         if(ul_width-div.scrollLeft<=0 || (div.scrollLeft % li_width != 0 && div.scrollLeft != 0)){   
  41.             div.scrollLeft=0;   
  42.         }   
  43.     }      
  44.     this.istop=function(){   
  45.         clearInterval(self.mar);   
  46.     };   
  47.     this.istart=function(){   
  48.         self.mar = setInterval(function(){self.doSlide(20,40,0,1);},self.speed);   
  49.     };   
  50.        
  51.     this.initialize = function(){          
  52.         ul.innerHTML+=ul.innerHTML;   
  53.         ul.style.width = parseInt(ul_width * 2) + 'px';   
  54.         a.onclick=function(e){self.doSlide(20,40,0,3);return false;};   
  55.         a.onfocus=function(){this.blur();};   
  56.         a.onmouseout=function(){self.istart();};   
  57.         a.onmouseover=function(){self.istop();};   
  58.         b.onclick=function(e){self.doSlide(20,40,1,3);return false;};   
  59.         b.onfocus=function(){this.blur();};   
  60.         b.onmouseout=function(){self.istart();};   
  61.         b.onmouseover=function(){self.istop();};   
  62.         div.onmouseout=function(){self.istart();};   
  63.         div.onmouseover=function(){self.istop();};   
  64.         this.istart();   
  65.     };   
  66.        
  67.     this.initialize();   
  68. }  

页面HTML代码(scroll.html)：

XML/HTML代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <title>doc1</title>  
  5. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
  6. <link href="scroll.css" rel="stylesheet" type="text/css" />  
  7. <script type="text/javascript" src="scroll.js"></script>  
  8. </head>  
  9.   
  10. <body>  
  11. <div class="bc" id="scroll1">  
  12.     <a href="#left" class="scroll s1" title="向左滚动">向左滚动</a>  
  13.     <div class="scroll">  
  14.         <ul>  
  15.             <li>  
  16.                 <a href="#"><img src="http://image2.766.com/res/h000/h69/img200809111627130.jpg" /></a>  
  17.                 <h3><a href="#">魔幻《天地OL》</a></h3>  
  18.             </li>  
  19.             <li>  
  20.                 <a href="#"><img src="http://image2.766.com/res/h000/h68/img200809091601330.jpg" /></a>  
  21.                 <h3><a href="#">《名将三国》</a></h3>  
  22.             </li>  
  23.             <li>  
  24.                 <a href="#"><img src="http://image2.766.com/res/h000/h67/img200809051655460.jpg" /></a>  
  25.                 <h3><a href="#">变型金刚OL</a></h3>  
  26.             </li>  
  27.             <li>  
  28.                 <a href="#"><img src="http://image2.766.com/res/h000/h67/img200809051653330.jpg" /></a>  
  29.                 <h3><a href="#">盛大《八门OL》</a></h3>  
  30.             </li>  
  31.             <li>  
  32.                 <a href="#"><img src="http://image2.766.com/res/h000/h67/img200809051650450.jpg" /></a>  
  33.                 <h3><a href="#">回合制《穿越OL》</a></h3>  
  34.             </li>  
  35.             <li>  
  36.                 <a href="#"><img src="http://image2.766.com/res/h000/h69/img200809111633050.jpg" /></a>  
  37.                 <h3><a href="#">卡通网页游戏乐土</a></h3>  
  38.             </li>  
  39.         </ul>  
  40.     </div>  
  41.     <a href="#right" class="scroll s2" title="向右滚动">向右滚动</a>  
  42. </div>  
  43. </body>  
  44. </html>  

 

 效果预览：

效果预览

代码下载：点击下载

类别: Javascript | 引用: 0 | 评论: 12 | 阅读: 695 | 打印 | 打包

获取js后所带的参数，如：a.js?a=value1&b=value2

作者:青锋幽灵 日期:2008-09-10 11:23

将以下代码保存为：a.js 

JavaScript代码
  1. function querystring(){      
  2.     this.params = new Object();      
  3.     this.initialize = function(){      
  4.         var param=this.paramstring();      
  5.         if(param.length == 0) return;      
  6.         if(param.substring(0,1)=='?'){      
  7.             param=param.substring(1);      
  8.         }      
  9.         param = param.replace(/\+/g, ' ');      
  10.         var args = param.split('&');          
  11.         for (var i=0;i<args.length;i++){      
  12.             var value;      
  13.             var pair = args[i].split('=');      
  14.             var name = unescape(pair[0]);      
  15.             if (pair.length == 2)      
  16.                 value = unescape(pair[1]);      
  17.             else     
  18.                 value = name;             
  19.             this.params[name] = value;      
  20.         }      
  21.     };      
  22.     this.get = function(key, defvalue){      
  23.         return this.params[key]==null?defvalue:this.params[key];      
  24.     };      
  25.     this.paramstring = function(){       
  26.         var col=document.getElementsByTagName("script");       
  27.         var jsrc=col.item(col.length-1).src;       
  28.         var i=jsrc.indexOf("?");       
  29.         var words=jsrc.substr(i+1,jsrc.length);       
  30.         return(words);       
  31.     };      
  32.     this.initialize();      
  33. }      
  34.      
  35. var q = new querystring();      
  36. var a = q.get('a','defaultvalue'); //defaultvalue是默认值      
  37. var b = q.get('b','defaultvalue'); //defaultvalue是默认值   

调用：    

XML/HTML代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
  5. <script type="text/javascript" src="a.js?a=baidu&b=google"></script>  
  6. <title>无标题文档</title>  
  7. </head>  
  8.   
  9. <body>  
  10. <!--   
  11. 　　js运行结果将得到：   
  12. 　　a=baidu  
  13. 　　b=google  
  14. -->  
  15. </body>  
  16. </html>  

 

是不是很有趣呢？呵呵～～

类别: Javascript | 引用: 0 | 评论: 3 | 阅读: 670 | 打印 | 打包

一天弹出一次的广告JS代码

作者:青锋幽灵 日期:2008-09-10 02:02

有一个页面有两条图片广告，当用户访问这个页面时按十分之一的概率随机点击两个广告中的一个广告，当该用户已经弹出过广告则一天内不再弹出。

主函数：

name：cookie名称
urls：广告地址数组
width：宽度
height：高度 

JavaScript代码
  1. function popad(name,urls,width,height)        
  2. {       
  3.     if(!name || !urls) return false;       
  4.     width = width ? width : 300;       
  5.     height = height ? height : 300;       
  6.     var cookieString = new String(document.cookie);       
  7.     var cookieName = name+'=';       
  8.     var pos = cookieString.indexOf(cookieName);       
  9.     if (pos <0){       
  10.         if(rand(10)==1) {       
  11.             url = urls[rand(urls.length)-1];       
  12.             window.open(url,'hello','location=yes,resizable=yes,width='+width+',height='+height);        
  13.             var now = new Date();       
  14.             expiredate = new Date(now.getYear(),now.getMonth(),now.getDate(),23,59,59);       
  15.             document.cookie = name+'=opened;expires='+ expiredate.toGMTString();       
  16.         }       
  17.     }        
  18. }   

 随机函数：

返回的值为1~number的值。 

JavaScript代码
  1. function rand(number) {       
  2.     return Math.floor(Math.random() * number + 1);       
  3. }  

 调用： 

JavaScript代码
  1. adurls = new Array('http://www.163.com','http://www.cnfol.com');       
  2. popad('popad', adurls, 800, 600);   
类别: Javascript | 引用: 0 | 评论: 0 | 阅读: 713 | 打印 | 打包

Javacript+xml+DOM 浏览器兼容性问题

作者:青锋幽灵 日期:2008-09-09 15:13

javacript中对xml dom的支持，与其他任何特性一样面临着浏览器兼容问题。

一 IE中的XML DOM
1.微软通过ActiveX的MSXML库提供了支持，通过：
var oXmlDom = new ActiveXObject("MSXML2.DOMDocument.5.0")得到一个XML DOM对象，这是在IE6中的，如果你的IE是更老版本的，可以使用下面的函数得到，如果你没有安装MSXML，将不能得到：

[code]
function createXMLDOM() {

var arrSignatures = ["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0",

[阅读全文]

标签: javascript xml dom
类别: Javascript | 引用: 0 | 评论: 0 | 阅读: 690 | 打印 | 打包

一个简单的Ajax类

作者:青锋幽灵 日期:2008-09-08 11:44

JavaScript代码
  1. /**  
  2.     Powered By CMSDream Copyright © 2007-2008 All rights reserved.  
  3.     14:21 2008-5-10  
  4. **/  
  5. function CMSDreamAjaxLib(){   
  6.     /**//**  
  7.     成员变量  
  8.     */  
  9.     this.XMLHttpReq = null;         //XML对象   
  10.     this.method = "post";           //执行的方法(post/get)   
  11.     this.url = "";              //异步调用的页面地址   
  12.     this.responseText = "";         //异步返回的响应字符串   
  13.     this.responseXML = "";          //异步返回的响应XML   
  14.     this.failed = false;            //创建对象错误标志   
  15.        
  16.     /**//**  
  17.     事件区  
  18.     */  
  19.     this.onLoading = function() {};     //正在发送请求   
  20.     this.onLoaded = function() {};      //已经接收到全部响应内容   
  21.     this.onInteractive = function() {}; //正在解析响应内容   
  22.     this.onCompletion = function() {};  //响应内容解析完成   
  23.     this.onError = function