Ir para conteúdo
Fórum Script Brasil
  • 0

Javascript Mudar Imagem

Jony Walker

Perguntado por Jony Walker,

 Share

Pergunta

Jony Walker

Jony Walker

Postado
Postado

O esquema que estou tentando montar é assim: a img tem um rollOver, mas quando clicar nela e carregar o link dentro do iframe, ficar a img do rollOver, pra não ter que reescrever o nome do link dentro do iframe.

Alguém tem uma sugestão ? vou tentar montar algo e posto aqui pra ver se estou no caminho certo

Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0
babaloricha

babaloricha

Postado
Postado

opa que e que eu ainda não atualizei :P

ma olha o codigo aqui ele está um pouco alterado pra ficar na vertical ! mas olha ele ai

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#mask{
    position:absolute;
    width:113px;
    height:427px;
    z-index:1;
    left: 650px;
    top: 68px;
    overflow:hidden;
    background-color:#d6fccd;
}
#menu{
    position:absolute;
    width:103px;
    height:603px;
    z-index:2;
    left: 3px;
    top: -24px;
    overflow:visible;
}
#setas {
    position:absolute;
    width:112px;
    height:44px;
    z-index:2;
    left: 653px;
    top: 16px;
    background:d6fccd;
}
-->
</style>
</head>
<script language="JavaScript">
var velo_scroll = 20; // velocidade da rolagem
var pixel_scroll = 10; // quantidade de saltos entre os pixels
var window_width = 400; 
var isNav;
var isIE;
var coll = "";
var styleObj = "";
if (parseInt(navigator.appVersion) >= 4) {
if (navigator.appName == "Netscape") {
isNav = true;
} else {
isIE = true;
coll = "all.";
styleObj = ".style";
}
}

function getObjWidth(obj) {
var theObj = eval("document." + coll + obj);
if (isNav) {
return theObj.clip.width;
} else {
return theObj.clientWidth;
}
}

function getObject(obj) {
if (typeof obj == "string") {
theObj = eval("document." + coll + obj + styleObj);
} else {
theObj = obj;
}
return theObj;
}

function getInsideWindowWidth() {
if (isNav) {
return window.innerWidth;
} else {
return document.body.clientWidth;
}
}

function getObjectLeft(obj) {
var theObj = getObject(obj);
if (isNav) {
return theObj.left;
} else {
return theObj.pixelLeft;
}
}

function shiftBy(obj, x, y) {
var theObj = getObject(obj);
if (isNav) {
theObj.left = theObj.left + x;
theObj.top = theObj.top + y;
} else {
theObj.pixelLeft = theObj.pixelLeft + x;
theObj.pixelTop = theObj.pixelTop + y;
}
}

var tim = 0;
var noScroll = true;

function mLeft(obj) {
obj = "menu"
if(!noScroll && getObjectLeft(obj) < window_width) {
shiftBy(obj,0,pixel_scroll);
tim = setTimeout("mLeft()", velo_scroll);
}
}

function mRight(obj) {
obj = "menu";
//if(!noScroll && getObjectLeft(obj) > -(getObjWidth(obj) - (getInsideWindowWidth())) - window_width) {
shiftBy(obj,0,-pixel_scroll);
tim = setTimeout("mRight()", velo_scroll);
}
//}

function noMove() {
clearTimeout(tim);
noScroll = true;
}
f1 = new Image(432,364);
f1.src = "f1.JPG";
f2= new Image(432,364)
f2.src = "f2.JPG";
f3= new Image(432,364)
f3.src = "f3.JPG";
f4= new Image(432,364)
f4.src = "f4.JPG";
f5= new Image(432,364)
f5.src = "f5.JPG";
f6= new Image(432,364)
f6.src = "f6.JPG";
</script>


<body bgcolor="d6fccd">
<div id="setas">
<a href="#" onmouseover="noScroll=false; mLeft('menu')" onmouseout="noMove()"><img src="cima.JPG" width="50" height="44" /></a>
<a href="#" onMouseOver="noScroll=false; mRight('menu')" onMouseOut="noMove()"><img src="baixo.JPG" width="50" height="45" /></a></div>
<!--<p><a href="#" onmouseover="noScroll=false; mLeft('menu')" onmouseout="noMove()">Esquerda</a>
    <a href="#" onMouseOver="noScroll=false; mRight('menu')" onMouseOut="noMove()">Direita</a></p>-->
<div id="mask">
  <div id="menu"> <img src="f1.JPG" height="100" width="100" onclick="window.document['foto'].src = f1.src"/><img src="f2.JPG" height="100" width="100" onclick="window.document['foto'].src = f2.src" /></div>
</div>
<p><img src="f1.JPG" width="640" height="480" name="foto"/></p>
</body>
</html>
pra ficar vertical eu alterei 
function mLeft(obj) {
obj = "menu"
if(!noScroll && getObjectLeft(obj) < window_width) {
shiftBy(obj,0,pixel_scroll);
tim = setTimeout("mLeft()", velo_scroll);
}
}

function mRight(obj) {
obj = "menu";
//if(!noScroll && getObjectLeft(obj) > -(getObjWidth(obj) - (getInsideWindowWidth())) - window_width) {
shiftBy(obj,0,-pixel_scroll);
tim = setTimeout("mRight()", velo_scroll);
}
o original(horizontal) 
function mLeft(obj) {
obj = "menu"
if(!noScroll && getObjectLeft(obj) < window_width) {
shiftBy(obj,pixel_scroll,0);
tim = setTimeout("mLeft()", velo_scroll);
}
}

function mRight(obj) {
obj = "menu";
if(!noScroll && getObjectLeft(obj) > -(getObjWidth(obj) - (getInsideWindowWidth())) - window_width) {
shiftBy(obj,-pixel_scroll,0);
tim = setTimeout("mRight()", velo_scroll);
}

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,4k
    • Posts
      652,3k
×
×
  • Criar Novo...