新闻切换效果

Submitted by 爱得 on 2010, May 19, 3:13 PM

有空时修改的新闻切换效果.原作者是经典某位仁兄.

之后又找了去一个网站偷了一个...

脚本.这个修改了一点点.

偷的那个没动过...学习无止境.

一个效果图

» 阅读全文

Tags: web标准, tab

Web标准 | 评论:0 | Trackbacks:0 | 阅读:481

纯记念一个人....

Submitted by 爱得 on 2010, May 4, 10:27 PM

此帖仅忆惜一位昔日的同学,希望她在另一个世界过得好...

如此而已.

明天再编辑下地址,发下学习的第一个JQ.

如果奇迹没有出现,那就去创造一个......

如下.

 一张图片,让你看明白是什么东东..

» 阅读全文

Tags: web标准

Web标准 | 评论:0 | Trackbacks:0 | 阅读:366

纠结在仿下拉中.

Submitted by 爱得 on 2010, April 21, 2:59 PM

最近用得一个效果,如图:

一张效果图片

先看结构.

XML/HTML代码
  1. <div class="NSerBox clear">  
  2.     <div id="SerBoxClass" class="SerBox" onclick="Onclick('Class');">  
  3.         <p id="input_Class">选择分类</p>  
  4.     </div>  
  5.     <ul class="filetree" id="TreeBoxClass" style="display:none;" onmouseout="aiout('Class')" onmouseover="aiover('Class')">  
  6.         <li><a href="#" onclick="ok('Class',this)">笔记本1</a></li>  
  7.         <li><a href="#" onclick="ok('Class',this)">笔记本2</a></li>  
  8.         <li><a href="#" onclick="ok('Class',this)">笔记本3</a></li>  
  9.         <li><a href="#" onclick="ok('Class',this)">笔记本4</a></li>  
  10.         <li><a href="#" onclick="ok('Class',this)">笔记本5</a></li>  
  11.     </ul>  
  12. </div>  

主要考虑到p的宽度,以及用背景时能更好的处理CSS,而用不着去另写结构.

当然,看到那么多onclick,其实主要由于个人JS不过关导致的,见谅!

下面是JS.拼在一起能运行没出错.呵呵

» 阅读全文

Tags: web标准, 菜单

Web标准 | 评论:0 | Trackbacks:0 | 阅读:377

右下角定位--absolute与fixed

Submitted by 爱得 on 2010, March 30, 4:13 PM

工作中考虑的两种右下角定位--两个实例,都涉及JS

XML/HTML代码
  1. <div id="aide">例子二</div>   
JavaScript代码
  1. function _(id){ return document.getElementById(id);}      
  2. if(navigator.userAgent.toLowerCase().indexOf("msie 6.0") != -1){      
  3. window.setInterval(   
  4. function(){      
  5. var top = (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight);      
  6. var left = (document.documentElement.clientWidth > document.body.clientWidth) && (document.documentElement.clientWidth != 0) ? document.documentElement.clientWidth : document.body.clientWidth;      
  7. _('PosiFixed').style.position = "absolute";      
  8. _('PosiFixed').style.top = (top - 70) + "px";      
  9. }      
  10. , 500);      
  11. }      
  12.   
  13. //例子二      
  14. function adBox(){       
  15. var aide = document.getElementById("aide");       
  16. aide.style.top = document.documentElement.scrollTop+document.documentElement.clientHeight-225+"px";      
  17. setTimeout(function(){adBox();},100);       
  18. }      
  19. adBox();    

» 阅读全文

Tags: 定位, web标准

Web标准 | 评论:0 | Trackbacks:0 | 阅读:441

tab练习...

Submitted by 爱得 on 2010, March 29, 2:46 PM

1.html结构

XML/HTML代码
  1. <div id="tabBox">  
  2.    <div id="tabMenu">  
  3.        <ul>  
  4.           <li class="cursor">选择一</li>  
  5.           <li>选择二</li>  
  6.        </ul>  
  7.    </div>  
  8.    <div id="tabContent">  
  9.       <div>  
  10.          <ul>  
  11.    <li><a href="">有无关于前端，WEB标准等的杂志 New1</a></li>  
  12.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  13.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  14.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  15.          </ul>  
  16.       </div>  
  17.       <div class="aide">  
  18.          <ul>  
  19.    <li><a href="">有无关于前端，WEB标准等的杂志 New2</a></li>  
  20.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  21.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  22.    <li><a href="">有无关于前端，WEB标准等的杂志 New</a></li>  
  23.          </ul>  
  24.       </div>  
  25.    </div>  
  26. </div>  
  27. <script type="text/javascript">aiTab('tabMenu','tabContent');</script>  

» 阅读全文

Web标准 | 评论:0 | Trackbacks:0 | 阅读:416

如何快速定位页面中复杂 CSS BUG 问题

Submitted by 爱得 on 2010, March 25, 12:14 PM

本文转载自:http://www.planabc.net/2009/01/14/how_to_quickly_locate_the_complicated_css_bug/#comment-2520

相信大家对于常见 CSS BUG 的处理已经相对比较熟悉，例如：IE6 Three Pixel Gap、IE5/6 Doubled Float-Margin Bug 等等。但时常我们也会碰到复杂的 CSS BUG 问题，所谓“复杂”实质是指触发的条件很复杂，而“BUG” 也并非指一定是浏览器的 BUG 。对于此类问题，我们首先要解决的是如何定位到问题，只有快速的定位到问题，才能更好的解决问题。

对于快速定位，个人的经验处理一般如下（基本可以定位到我在 淘宝 遇到的 90% 以上的复杂 CSS BUG 问题）：

1、检查页面的标签是否闭合

不要小看这条，也许折腾了你两天都没有解决的 CSS BUG 问题，却仅仅源于这里。毕竟页面的模板一般都是由开发来嵌套的，而他们很容易犯此类问题。

快捷提示：可以用 Dreamweaver 打开文件检查，一般没有闭合的标签，会黄色背景高亮。

2、样式排除法

有些复杂的页面也许加载了 N 个外链 CSS 文件，那么逐个删除 CSS 文件，找到 BUG 触发的具体 CSS 文件，缩小锁定的范围。

对于刚才锁定的问题 CSS 样式文件，逐行删除具体的样式定义，定位到具体的触发样式定义，甚至是具体的触发样式属性。

3、模块确认法

有时候我们也可以从页面的 HTML 元素出发。删除页面中不同的 HTML 模块，寻找到触发问题的 HTML 模块。

» 阅读全文

Tags: css bug, 标准

Web标准 | 评论:0 | Trackbacks:0 | 阅读:262

Records:106‹12345678910›»