`
lijun87
  • 浏览: 268292 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

Marquee为什么不符合WEB标准?

    博客分类:
  • JSP
阅读更多
 在经典论坛中看到网友jeanjean20提到Marquee怎么样修改才能符合标准。我看了一下朋友们的跟帖觉得说得都挺好,版主greengnn指明Marquee是不符合标准的已经被W3C抛弃了。有朋友大打不平的说觉得去得没道理,本来挺好的效果现在变没了。也有朋友说去了好,看着就烦。大家都有自己的理解角度,但是我们自己怎么理解是一回事,但是我们要弄清楚为什么,在这里我就greengnn的结论之后修改并补充一些内容,希望大家理解并能想通。

  首先要更正的一点是:Marquee被W3C抛弃了。这句话其实这是错误的,为什么呢,因为Marquee从来都没有被W3C视为正式标签使用。W3C从来就没有制定这一标签,就更没有“抛弃”一说。这就好比还没结婚就说离婚一样。其实Marquee与很多其它的标签一样是由微软与网景等公司私制的,而W3C一直以来都没有承认这一标签。这有钱公司就是有不讲理这点毛病,不过这不盈利的组织就是嘴硬!

  为什么W3C一直不承认Marquee呢?要说这个标签在广大网页设计人员的眼里也算是把螺丝刀啊!在早年还是我们引以为技术力量作为炫耀的资本呢。可现在不主张用了(这里要题外话:很多人说W3C不许用了,这都是错的,W3C没权限制你不许用或是不能用。),为什么呢那我们要明确这个标准是什么。标准并不是一项技术,标准只是一种规范与提议。我们用的依然是原来的HTML4.0中的标签,标准没有给我们的XHTML中加入什么标签,而是给出了哪些是推荐使用的(例:p,div,ul,dl,span,em…),哪些是主张不使用的(例:font,b,u,i…),并且主张了要语义化与使用规范。当然标准不只是XHTML同时还包括了CSS与DOM还有脚本语言。很多人以为CSS是标准后才产生的,其实不是,CSS很早就有了,标准之于CSS也是一样,主张不使用一些浏览器厂商制定的一些CSS,比如CSS滤镜。

  在标准中还有很重要的一点,那就是功能性分离。分成为结构、样式、行为三个部分,这三个部分分别包括了,结构(xHTML、XML),样工(CSS),行为(DOM、ECMAScript)。到这里我们返回来想想那个Marquee为什么不被W3C所承认,我想大家伙都应明白了。他与FONT、B等标签一样已经不是结构性标签了。他们中带有了样式与行为特性,再把他们划在结构的范畴里很明显是多多余了。

  所以,大家希望Marquee的效果能被保留或是实现就需要多多关注一下JavaScript,脚本语言一定能让你的网页动起来。要想让你指定的地方动起来当然要注意标签中的ID与CLASS的使用。

  为了方便大家使用这个有意思的效果,我特意请嗷嗷写了一段JS,看以下代码:

  JS代码:
span style="FONT-WEIGHT: 100; COLOR: #f7f7f7"> 
function getElementsByClass(searchClass,tagName) {
var classElements = new Array();
if ( tagName == null )
  tagName = '*';
var els = document.getElementsByTagName(tagName);
var elsLen = els.length;
var pattern = new RegExp("(^|\s)"+searchClass+"(\s|$)");
for (i = 0, j = 0; i < elsLen; i++) {
  if ( pattern.test(els[i].className) ) {
   classElements[j] = els[i];
   j++;
  }
}
return classElements;
}

function ccMarquee(className){
var a=getElementsByClass(className);
for (i = 0; i < a.length; i++) {
  a[i].innerHTML="<marquee>"+ a[i].innerHTML+"</marquee>";
}
}window.onload = function () {
ccMarquee("ccMarquee");
}
  XHTML代码:


<div class="ccMarquee">
<a href="" title="">这里是滚动的</a>
</div>

  请大家注意,需要用到滚动效果的地方只要在其何外围的标签上加上Class="ccMarquee"即可。注意大小写。

附: <marquee>标签属性详解

  请大家先看下面这段代码

<marquee direction=up behavior=scroll loop=3 scrollamount=1 scrolldelay=10 align=top bgcolor=#ffffff height=300 width=30% hspace=20 vspace=10 onmouseover=this.stop() onmouseout=this.start()> 此处输入滚动内容 </marquee>
  现在让我们来具体分析一下

◎ direction表示滚动的方向,值可以是left,right,up,down,默认为left
◎ behavior表示滚动的方式,值可以是scroll(连续滚动)slide(滑动一次)alternate(来回滚动)
◎ loop表示循环的次数,值是正整数,默认为无限循环
◎ scrollamount表示运动速度,值是正整数,默认为6
◎ scrolldelay表示停顿时间,值是正整数,默认为0,单位似乎是毫秒
◎ align表示元素的垂直对齐方式,值可以是top,middle,bottom,默认为middle
◎ bgcolor表示运动区域的背景色,值是16进制的RGB颜色,默认为白色
◎ height、width表示运动区域的高度和宽度,值是正整数(单位是像素)或百分数,默认width=100% height为标签内元素的高度
◎ hspace、vspace表示元素到区域边界的水平距离和垂直距离,值是正整数,单位是像素。
◎ onmouseover=this.stop() onmouseout=this.start()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。
分享到:
评论

相关推荐

    marquee无缝隙循环

    本文将重点介绍如何使用JavaScript实现marquee的无缝隙循环效果,特别是解决常见的三个问题:不符合W3C标准、代码移植性差以及动态添加图片时的局限性。 #### 二、背景与挑战 ##### 1. HTML不符合W3C的最新标准 ...

    推荐通用文字图片JS不间断滚动封装类 代替Marquee

    最后,关于"代替Marquee",这表明这个封装类提供了一种更现代、更符合Web标准的解决方案,能够实现与Marquee类似的效果,同时避免了Marquee的一些缺点,如不支持CSS动画、语义不清等。 总的来说,这个压缩包中的...

    基于Web标准的网页设计与制作

    在互联网时代,网页的设计与制作是构建网络平台和提供信息内容的基础。基于Web标准的网页设计与...更为重要的是,设计人员需要始终以Web标准为基础,确保网页的设计与开发既符合技术规范,又能够提供优秀的用户体验。

    Marquee高级用法实例代码

    - 不符合Web标准和可访问性要求。 - 会影响页面的加载性能和用户体验。 - 推荐的替代方案包括使用CSS3的动画、transition效果或者JavaScript库来实现滚动效果,这些方式更加灵活且易于维护,同时兼容性更好。 4. ...

    HTML标签marquee实现滚动效果的简单方法(必看)

    虽然它简单易用,但并不符合现代Web标准,且已被CSS3所取代。不过,了解它在早期网页设计中扮演的角色仍然有其价值。 marquee标签的基本语法是直接在HTML文档中插入标签,并在其内部放入需要滚动的内容。这个标签...

    用javascript代替marquee的滚动字幕效果代码

    随着Web标准的发展与普及,许多早期HTML标签因为不符合现代Web设计规范而逐渐被淘汰或被边缘化,`&lt;marquee&gt;`标签就是其中之一。尽管`&lt;marquee&gt;`标签提供了方便快捷的文字滚动功能,但由于其缺乏可控制性和对用户体验...

    html借助marquee实现文字左右滚动

    这种方法更现代,且遵循了Web标准。在这个方法中,我们需要一个div元素来作为滚动容器,通过设置其white-space属性为nowrap来保证内容在水平方向上不换行,同时将overflow属性设置为hidden,确保超出容器宽度的内容...

    WEB开发技术思考题

    【WEB开发技术思考题】涉及了HTML的基本结构和元素,以及一些常见的网页设计技巧。以下是对这些知识点的详细解析: ...例如,`;...了解并掌握这些知识,有助于开发者构建符合标准的、具有交互性的网页内容。

    JQuery实现文字无缝滚动效果示例代码(Marquee插件)

    Marquee插件是一个依托于jquery库的插件,它可以帮助开发者轻松地在网页上创建各种滚动效果,并且使得相应的HTML代码符合W3C标准。 要使用Marquee插件实现文字或图片的无缝滚动效果,首先需要加载必要的javascript...

    详解html中的marquee属性

    然而,需要注意的是,`&lt;marquee&gt;`并不是HTML标准的一部分,它最初是在Internet Explorer 3版本中引入的,并且在现代Web开发中已经不推荐使用,因为它可能对页面的可访问性和语义化造成负面影响。尽管如此,理解这个...

    无间断滚动的新闻文章列表,兼容IE、Firefox和Opera,符合W3C标准。可作Marquee

    文档强调了该功能遵循W3C标准,这意味着整个项目的开发过程中注重了对Web开放标准的遵守,具体表现在以下几个方面: 1. **语义化HTML**:使用合适的HTML标签来表示页面结构和内容,比如使用`&lt;article&gt;`、`&lt;section&gt;...

    制作滚动字幕,很方便!

    - 如果可能,应考虑使用CSS动画或JavaScript来实现类似的效果,这些方法更符合现代Web标准,同时也更加灵活可控。 通过以上介绍,我们可以看到 `&lt;marquee&gt;` 标签虽然简单易用,但其提供的定制化选项也非常丰富。...

    Web程序的设计基础实验报告.docx

    【Web程序设计基础实验报告】 本实验主要涵盖了Web程序...这些基础知识是Web开发的基石,对于进一步学习CSS(Cascading Style Sheets)和JavaScript等前端技术至关重要,为今后开发复杂的Web应用程序打下坚实基础。

    IPanel应用开发指南

    iPanel应用开发指南是针对iPanel IPTV应用的开发文档,提供了关于iPanel电视应用的详细设计指导、对WEB标准的支持情况以及扩展功能模块等信息,旨在帮助web设计人员和开发者制作出更适合iPanel浏览器的电视应用。...

    文字滚动显示

    ### 文字滚动显示 在网页设计中,为了增强页面的动态效果或突出显示...然而,在实际开发中,考虑到兼容性和标准性问题,开发者可能还需要考虑使用CSS动画或者JavaScript来实现更复杂、更符合现代Web标准的滚动效果。

    网页设计HTML图片滚动代码.docx

    这些方法提供了更高的定制性和更好的浏览器兼容性,同时也更符合Web标准,有助于提升网页的用户体验。 总之,虽然`&lt;marquee&gt;`标签在现代网页设计中已逐渐被淘汰,但它代表了早期网页技术的一个阶段,理解其工作原理...

    marquees的无缝循环

    **正文** 在网页设计中,`&lt;marquee&gt;`标签...在实际应用中,应优先选择符合Web标准的技术,以确保网页的兼容性和可维护性。然而,对于一些简单的滚动需求,`&lt;marquee&gt;`标签仍然是一种快速实现无缝循环滚动的便捷方式。

    JavaScript滚动字幕事件.pdf

    然而,值得注意的是,`&lt;marquee&gt;`标签并不符合现代Web开发的标准,因为它不支持响应式设计,且对可访问性不友好。现代Web开发倾向于使用CSS动画或者JavaScript库如jQuery来实现更可控、更灵活的滚动效果。 总的来说...

    HTML跑马灯

    - `&lt;marquee&gt;`标签并不符合现代Web标准,在某些浏览器中可能不受支持或存在兼容性问题。 - 对于更复杂的动画效果,建议使用CSS3动画或JavaScript库替代。 - 使用跑马灯时要注意不要过度使用,以免对用户体验造成负面...

    网页中滚动字的源代码

    这种方式不仅更符合现代Web标准,也提供了更多样化的控制和定制选项。 ### 总结 通过上述讨论,我们深入了解了网页中滚动文字的实现原理和技术细节。无论是使用传统的`&lt;marquee&gt;`标签还是更先进的CSS3动画,都可以...

Global site tag (gtag.js) - Google Analytics