Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Gans

[Resolvido] DIV com Rolagem por botão

Recommended Posts

Boa noite pessoal, estou com uma duvida.

Sabem aquelas vitrines do produtos que ficam passando os produtos que se você poe o mouse de um lado ele rola pra um lado e se você poe o mouse do outro ele rola do outro? Com as imagens passando no meio...

 

Exemplo:

http://img220.imageshack.us/my.php?image=menuco2.jpg

 

Ai quando colocasse o mouse na setinha ele rolasse e fosse mostrando as imagens?

 

Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui achar, o codigo ta ai pra quem tem a mesma duvida:

 

<script language="JavaScript1.2">

//Aqui vão as imagens das setas
var goleftimage='imagens/left.jpg'
var gorightimage='imagens/right.jpg'
//Configure o tamanho do seu menu
var menuwidth=695
//Velocidade do scroll do menu (1-10), quanto maior o número, maior a velocidade
var scrollspeed=6
//Links do menu:Substitua os meus links pelos seus e apague ou acrescente se necessitar
var menucontents='<nobr><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /><img src="imagens/nophoto.gif" alt="Galeria de Fotos" /></nobr>'


var actualwidth=''
var ns_scroll
function fillup(){
if (document.all){
test2.innerHTML=menucontents
actualwidth=test2.offsetWidth
}
else if (document.layers){
ns_scroll=document.ns_scrollmenu.document.ns_scrollmenu2
ns_scroll.document.write(menucontents)
ns_scroll.document.close()
actualwidth=ns_scroll.document.width
}
}
window.onload=fillup

function moveleft(){
if (document.all&&test2.style.pixelLeft>(menuwidth-actualwidth))
test2.style.pixelLeft-=scrollspeed
else if (document.layers&&ns_scroll.left>(menuwidth-actualwidth))
ns_scroll.left-=scrollspeed
lefttime=setTimeout("moveleft()",50)
}

function moveright(){
if (document.all&&test2.style.pixelLeft<0)
test2.style.pixelLeft+=scrollspeed
else if (document.layers&&ns_scroll.left<0)
ns_scroll.left+=scrollspeed
righttime=setTimeout("moveright()",50)
}

if (document.all||document.layers){
with (document){
write('<table border="0" cellspacing="0" cellpadding="0">')
write('<td valign="middle"><a href=#" onMouseover="moveright()" onMouseout="clearTimeout(righttime)"><img src="'+goleftimage+'"border=0></a> </td>')
write('<td valign="top">')
if (document.all){
write('<span style="position:relative;width:'+menuwidth+';">')
write('<span style="position:absolute;width:'+menuwidth+';clip:rect(0 '+menuwidth+' auto 0)">')
write('<span id="test2" style="position:absolute;left:0;top:0">')
write('</span></span></span>')
}
else if (document.layers){
write('<ilayer width='+menuwidth+' name="ns_scrollmenu">')
write('<layer name="ns_scrollmenu2" left=0 top=0></layer></ilayer>')
}
write('</td>')
write('<td valign="middle"> <a href="#" onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)">')
write('<img src="'+gorightimage+'"border=0></a>')
write('</td></table>')
}
}
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.