Guest Posted November 27, 2012 Report Share Posted November 27, 2012 Boa noite, Preciso de exemplo como implementar o seguinte: Tenho uma página html com 4 botões e uma caixa de imagem, pretendo que ao passar o rato sobre os botões altere a imagem visualizada na caixa de imagem. Obrigado Jorge Link to comment Share on other sites More sharing options...
apocsantos Posted November 27, 2012 Report Share Posted November 27, 2012 Boa noite, E a duvida é exactamente onde ? Tens o evento "onmouseover()" em javascript. Cordiais cumprimentos, Apocsantos "A paciência é uma das coisas que se aprendeu na era do 48k" O respeito é como a escrita de código, uma vez perdido, dificilmente se retoma o habito" Link to comment Share on other sites More sharing options...
DanielAmorim Posted November 29, 2012 Report Share Posted November 29, 2012 Boas, Escrevi um exemplo muito simples que penso que te irá ajudar. No exemplo usei jQuery para garantir que o registo no evento é cross-browser e para simplificar o código. A imagem de cada botão a ser apresentada na imagem é configurada no botão através de um custom attribute, o img. <html> <head> <title>Test page</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script> </head> <body> <div> <input type="button" value="button 1" class="button-selector" img="http://goo.gl/LZFwI"/> <input type="button" value="button 2" class="button-selector" img="http://goo.gl/7XerQ"/> <input type="button" value="button 3" class="button-selector" img="http://goo.gl/CkdpF"/> <input type="button" value="button 4" class="button-selector" img="http://goo.gl/ZxyYb"/> </div> <div> <img id="image-placeholder"/> </div> <script type="text/javascript"> $(document).ready( function(){ $(".button-selector").mouseenter( function(e){ $("#image-placeholder").attr('src', e.srcElement.attributes["img"].value); } ); } ); </script> </body> </html> Daniel Amorim VP for xRTML http://www.xrtml.org http://www.realtime.co Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now