Javascript Marquee to replace tags
前端 未结 6 1770
再見小時候
再見小時候 2020-11-27 07:41

I\'m hopeless at Javascript. This is what I have:



        
6条回答
  •  有刺的猬
    2020-11-27 08:15

    Simple javascript solution:

    window.addEventListener('load', function () {
    	function go() {
    		i = i < width ? i + step : 1;
    		m.style.marginLeft = -i + 'px';
    	}
    	var i = 0,
    		step = 3,
    		space = '     ';
    	var m = document.getElementById('marquee');
    	var t = m.innerHTML; //text
    	m.innerHTML = t + space;
    	m.style.position = 'absolute'; // http://stackoverflow.com/questions/2057682/determine-pixel-length-of-string-in-javascript-jquery/2057789#2057789
    	var width = (m.clientWidth + 1);
    	m.style.position = '';
    	m.innerHTML = t + space + t + space + t + space + t + space + t + space + t + space + t + space;
    	m.addEventListener('mouseenter', function () {
    		step = 0;
    	}, true);
    	m.addEventListener('mouseleave', function () {
    		step = 3;
    	}, true);
    	var x = setInterval(go, 50);
    }, true);
    #marquee {
       background:#eee;
       overflow:hidden;
       white-space: nowrap;
     }
    1 Hello world! 2 Hello world! 3 Hello world!

    JSFiddle

提交回复
热议问题