Question

绝对的初学者在这里。从字面上看，上周刚刚开始搞乱HTML。

我正在努力想出一种可以在网站上进行html编码的特效效果。我们有一个基本的HTML选框设置，但它很难读，很难阅读。我不知道该去哪里。

Answer 1

您可以使用jQuery来实现选框的结果。

看这里：http://plugins.jquery.com/marquee/ 在这里：http://aamirafridi.com/jquery/jquery-marquee-plugin#examples

如上所述：永远不要使用选框

谷歌搜索“marquee jquery”列出了很多结果

Answer 2

没有简单的选择。如果你想找到一个标准的解决方案，你必须是一个专业的javascript程序员，而不是一个简单的html标签，你必须去许多行代码。

大多数标准网络浏览器都支持它（谷歌浏览器除外，它无法将其渲染到选框标准）。

对于Chrome（并且Chrome只需要），你可以使用这个javascript代码...你不需要使用它（IE，Edge，Mozilla，Opera ......等）

var oMarquees = [], oMrunning,
        oMInterv =        20,     //interval between increments
        oMStep =          1,      //number of pixels to move between increments
        oStopMAfter =     0,     //how many seconds should marquees run (0 for no limit)
        oResetMWhenStop = false,  //set to true to allow linewrapping when stopping
        oMDirection =     'right'; //'left' for LTR text, 'right' for RTL text

/***     Do not edit anything after here     ***/
function doMStop() {
        clearInterval(oMrunning);
        for( var i = 0; i < oMarquees.length; i++ ) {
                oDiv = oMarquees[i];
                if( oResetMWhenStop ) {
                        oDiv.mchild.style.cssText = oDiv.mchild.style.cssText.replace(/;white-space:nowrap;/g,'');
                        oDiv.mchild.style.whiteSpace = '';
                        oDiv.style.height = '';
                        oDiv.style.overflow = '';
                        oDiv.style.position = '';
                        oDiv.mchild.style.position = '';
                        oDiv.mchild.style.top = '';
                }
        }
        oMarquees = [];
}
function doDMarquee() {
        if( oMarquees.length || !document.getElementsByTagName ) { return; }
        var oDivs = document.getElementsByTagName('div');
        for( var i = 0, oDiv; i < oDivs.length; i++ ) {
                oDiv = oDivs[i];
                if( oDiv.className && oDiv.className.match(/\bdmarquee\b/) ) {
                        if( !( oDiv = oDiv.getElementsByTagName('div')[0] ) ) { continue; }
                        if( !( oDiv.mchild = oDiv.getElementsByTagName('div')[0] ) ) { continue; }
                        oDiv.mchild.style.cssText += ';white-space:nowrap;';
                        oDiv.mchild.style.whiteSpace = 'nowrap';
                        oDiv.style.height = oDiv.offsetHeight + 'px';
                        oDiv.style.overflow = 'hidden';
                        oDiv.style.position = 'relative';
                        oDiv.mchild.style.position = 'absolute';
                        oDiv.mchild.style.top = '0px';
                        oDiv.mchild.style[oMDirection] = (oDiv.mchild.style[oMDirection] == '')?(oDiv.offsetWidth + 'px'):oDiv.mchild.style[oMDirection];
                        oMarquees[oMarquees.length] = oDiv;
                        i += 2;
                }
        }
        oMrunning = setInterval('aniMarquee()',oMInterv);
        if( oStopMAfter ) { setTimeout('doMStop()',oStopMAfter*1000); }
}
function aniMarquee() {
        var oDiv, oPos;
        for( var i = 0; i < oMarquees.length; i++ ) {
                oDiv = oMarquees[i].mchild;
                oPos = parseInt(oDiv.style[oMDirection]);
                if( oPos <= -1 * oDiv.offsetWidth ) {
                        oDiv.style[oMDirection] = oMarquees[i].offsetWidth + 'px';
                } else {
                        oDiv.style[oMDirection] = ( oPos - oMStep ) + 'px';
                }
        }
}
if( window.addEventListener ) {
        window.addEventListener('load',doDMarquee,false);
} else if( document.addEventListener ) {
        document.addEventListener('load',doDMarquee,false);
} else if( window.attachEvent ) {
        window.attachEvent('onload',doDMarquee);
}

Answer 3

我的建议是使用旋转木马代替。用户可以更好地控制它，因为可以通过鼠标单击停止和启动轮播。

材质设计轮播在这里：http://materializecss.com/carousel.html

HTML Marquee替代品

3 个答案: