este Javascript O código moverá uma única sequência de texto que contenha qualquer texto que você escolher através de um espaço de marca de seleção horizontal sem interrupções. Isso é feito adicionando uma cópia da sequência de texto ao início do rolo, assim que desaparece do final do espaço da marca de seleção. O script calcula automaticamente quantas cópias do conteúdo ele precisa criar para garantir que você nunca fique sem o texto na sua marca de seleção.
Isso inclui o código dos meus exemplos, que adiciona dois novos objetos mq que contêm as informações sobre o que exibir nessas duas marcas. Você pode excluir um deles e alterar o outro para exibir uma marca de seleção contínua em sua página ou repetir essas instruções para adicionar ainda mais marcas de seleção. A função mqRotate deve ser chamada passando mqr depois que as marcas de seleção são definidas, uma vez que manipularão as rotações.
// Letreiro de texto contínuo
// copyright 30 de setembro de 2009 por Stephen Chapman
// http://javascript.about.com
// é concedida permissão para usar esse Javascript em sua página da web
// desde que todo o código abaixo neste script (incluindo estes
// comments) é usado sem nenhuma alteração
função objWidth (obj) {if (obj.offsetWidth) retorna obj.offsetWidth;
if (obj.clip) retorna obj.clip.width; retornar 0;} var mqr = []; função
mq (id) {this.mqo = document.getElementById (id); var wid =
objWidth (this.mqo.getElementsByTagName ('span') [0]) + 5; var fulwid =
objWidth (this.mqo); var txt =
this.mqo.getElementsByTagName ('span') [0] .innerHTML; this.mqo.innerHTML
= ''; var heit = this.mqo.style.height; this.mqo.onmouseout = function ()
{mqRotate (mqr);}; this.mqo.onmouseover = function ()
{clearTimeout (mqr [0] .TO);}; this.mqo.ary = []; var maxw =
Math.ceil (fulwid / wid) +1; para (var i = 0; i <
maxw; i ++) {this.mqo.ary [i] = document.createElement ('div');
this.mqo.ary [i] .innerHTML = txt; this.mqo.ary [i] .style.position =
'absoluto'; this.mqo.ary [i] .style.left = (wid * i) + 'px';
this.mqo.ary [i] .style.width = wid + 'px'; this.mqo.ary [i] .style.height =
heit; this.mqo.appendChild (this.mqo.ary [i]);} mqr.push (this.mqo);}
função mqRotate (mqr) {if (! mqr) return; para (var j = mqr.length - 1; j
> -1; j--) {maxa = mqr [j] .ary.length; para (var i = 0; imqr [j] .ary [i] .style; x.left = (parseInt (x.left, 10) -1) + 'px';} var y =
mqr [j] .ary [0] .style; if (parseInt (y.left, 10) + parseInt (y.width, 10) <0)
{var z = mqr [j] .ary.shift (); z.style.left = (parseInt (z.style.left) +
parseInt (z.style.width) * maxa) + 'px'; mqr [j] .ary.push (z);}}
mqr [0] .TO = setTimeout ('mqRotate (mqr)', 10);}
O conteúdo de texto real da marca de seleção entra na div em uma tag de extensão. A largura da tag span é o que será usado como a largura de cada iteração do conteúdo na marca de seleção (mais 5 pixels apenas para separá-los).
Por fim, verifique se o seu código JavaScript para adicionar o objeto mq após o carregamento da página contém os valores corretos.
Para adicionar marcas de seleção adicionais, você pode configurar divs adicionais no HTML, fornecendo a cada um o seu próprio conteúdo de texto dentro de um intervalo; configure classes adicionais se quiser estilizar as marcas de forma diferente; e adicione quantas instruções mq () novas você tiver marcas de seleção. Certifique-se de que a chamada mqRotate () os siga para operar as marcas de seleção para nós.