关闭顶部展开顶部

Marquee为什么不符合WEB标准?_Div+CSS教程

编辑Tag赚U币
教程Tag:暂无Tag,欢迎添加,赚取U币!
  
  在经典论坛中看到网友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代码:

示例代码 [www.mb5u.com]
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代码:

示例代码 [www.mb5u.com]
<div class="ccMarquee">
<a href="" title="">这里是滚动的</a>
</div>

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

附: <marquee>标签属性详解

  请大家先看下面这段代码

示例代码 [www.mb5u.com]
<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>

  现在让我们来具体分析一下

示例代码 [www.mb5u.com]
◎ 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()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。

  

来源:无忧整理//所属分类:Div+CSS教程/更新时间:2007-02-14
loading.. 评论加载中....
相关Div+CSS教程
闂佹眹鍩勯崹閬嶆偤閺囶澁缍栭柛鈩冪⊕閳锋帗銇勯弴妤€浜惧銈忕秶閹凤拷
濠电偛顕慨顓㈠磻閹炬枼妲堥柡鍌濇硶婢ф稒淇婇懠顒夆偓婵嬫煟閵忊晛鐏查柟鍑ゆ嫹
濠电姷顣介埀顒€鍟块埀顒勵棑缁辩偛顓兼径瀣閻庣懓瀚竟鍡欐崲娑斾線鏌i姀鈺佺伈闁瑰嚖鎷�
濠电姷顣介埀顒€鍟块埀顒勵棑缁辩偛顓兼径濠勵吋闂佽鍨庨崟顓фК闂佽閰eḿ褍螞濞戙垺鍋夐柨鐕傛嫹
闂備胶枪缁绘劙骞婃惔銊ョ劦妞ゆ帒鍊哥敮鍫曞箹鐎涙ḿ鐭掔€规洘绻堥弫鎾绘晸閿燂拷
闂備胶枪缁绘劙骞婃惔銊ョ劦妞ゆ巻鍋撻柛姘儑缁﹪鏁傞崜褏鐓撻柣搴岛閺呮繈鎯屽▎鎴犵=濞撴艾锕ョ€氾拷
闂備浇銆€閸嬫挻銇勯弽銊р槈闁伙富鍣i弻娑樷攽閹邦亞鑳虹紓浣靛妽濡炶棄顕i妸鈺婃晬婵炲棙鍨电粭锟犳⒑閸濆嫬鈧骞婇幘鑸殿潟闁跨噦鎷�
闂備礁鎼崯鐗堟叏妞嬪海绀婂鑸靛姈閻擄綁鎮规潪鎷岊劅婵炲眰鍊曢湁闁挎繂妫欑粈鈧梺鍛娚戦悧鐘茬暦閹扮増鏅搁柨鐕傛嫹
婵犵妲呴崹顏堝礈濠靛棭鐔嗘俊顖氬悑鐎氱粯銇勯幘瀵哥畺閻庢熬鎷�
濠电姷顣介埀顒€鍟块埀顒勵棑缁辩偛顓奸崶銊ヮ伕濡炪倖鎸荤换鍐偓姘虫珪娣囧﹪顢涘Δ鈧晶鍙夌節椤喗瀚�
婵犵妲呴崹顏堝礈濠靛棭鐔嗘慨妞诲亾鐎规洦鍓熼、娆撳礂閻撳簶鍋撻悽鍛婄厸闁割偅绻勫瓭婵犳鍣幏锟�
婵犵妲呴崹顏堝礈濠靛棭鐔嗘慨妞诲亾闁哄苯鎳橀崺鈧い鎺嗗亾闁宠閰i獮鎴﹀箛闂堟稒顔嗛梻浣告惈鐎氭悂骞忛敓锟�
婵犵妲呴崹顏堝礈濠靛棭鐔嗘慨妞诲亾鐎规洩缍侀獮瀣攽閸偂绱�
濠电姷顣介埀顒€鍟块埀顒勵棑缁辩偛顓兼径濠勭厬闂佺懓鐡ㄧ换鍕敂鐎涙ü绻嗘い鏍殔婢у弶绻濋~顔藉
闂佽楠搁崢婊堝礈濠靛鍋嬮柟鎯版閻鈹戦悩鎻掓殭闁奸潧缍婇弻銈夋嚍閵夈儱顫嶉梺缁樼壄缂嶄礁鐣峰▎鎾存櫢闁跨噦鎷�
UB闂備礁婀辩划顖炲礉濡ゅ懐宓侀柛銉㈡櫆鐎氭岸鎮楀☉娅虫垿锝為敓锟�
闂備浇澹堟ご绋款潖婵犳碍鐒鹃悗鐢电《閸嬫捇鐛崹顔句痪濠电姭鍋撻柨鐕傛嫹
闂佽楠哥粻宥夊垂閸濆嫸鑰块柛銏㈠殰
闂備礁鎲″缁樻叏妞嬪海绀婂璺虹灱閸楁碍绻涢崱妤€顒㈤柛鐐差槹缁绘稓绱欓悩鍝勫帯闂佺ǹ楠忛幏锟�
缂傚倸鍊烽悞锕傛偡閿曞倸鍨傛繝濠傚椤╅攱銇勯幒宥囶槮缂佹彃婀遍埀顒傚仯閸婃繄绱撳棰濇晩闁跨噦鎷�
©2017 www.mb5u.com婵犵妲呴崹顏堝礈濠靛棭鐔嗘慨妞诲亾鐎殿噮鍣i幃鈺呭箵閹烘挸鐦�
闂備浇銆€閸嬫捇鏌熼婊冾暭妞ゃ儻鎷�&闂備礁鎲$敮鎺懳涢弮鍫燁棅闁跨噦鎷�