Ir para conteúdo

POWERED BY:

Arquivado

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

-=Felipe=-

[Resolvido] Como fazer uma imagem sumir

Por , em Javascript

Recommended Posts

-=Felipe=-    0

-=Felipe=-
Postado

Bom to com script de publçicidade que eu to criando, eu coloque um texto pra fechar, porem esta como imagem então eu tenho ke fazer a imagem sumir como posso fazer ela sumir quando alguem clicar no texto Fechar ?

 

Obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

Elektra    102

Elektra
Postado

Depende "como" vai carregar esta imagem na página.

 

Se for o carregamento de uma "imagem" no formato swf (mesmo que não tenha animação), e usar uma div "absoluta", com z index superior as demais divs da página, pode usar Java Script para ocultar o conteúdo ao clicar em um link "Fechar" (adicionado em outra div).

 

Exemplo: um banner swf em uma div com z index superior (div 2) e um link com botão fechar (div 1). O swf foi sobreposto a 2 links pra testar a "transparência" ao fechar o arquivo.

 

Código usado, bem simples, deve ter outros bem melhores:

 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"> 
<!--
body {
	background-color: #060;
}
#apDiv1 {
	position:absolute;
	left:411px;
	top:20px;
	width:142px;
	height:39px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:7px;
	top:12px;
	width:307px;
	height:395px;
	z-index:2;
	visibility: hidden;
}
-->
</style>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript"> 
<!--
function MM_showHideLayers() { //v9.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) 
  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>
</head>
 
<body>
<div id="apDiv1"><strong><a href="#" onclick="MM_showHideLayers('apDiv1','','hide','FlashID','','hide')">Fechar</a></strong></div>
<div id="apDiv2">
  <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="280" height="415">
    <param name="movie" value="New_3_OK.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <param name="swfversion" value="6.0.65.0" />
    <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
    <param name="expressinstall" value="Scripts/expressInstall.swf" />
    <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="New_3_OK.swf" width="280" height="415">
      <!--<![endif]-->
      <param name="quality" value="high" />
      <param name="wmode" value="transparent" />
      <param name="swfversion" value="6.0.65.0" />
      <param name="expressinstall" value="Scripts/expressInstall.swf" />
      <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
      <div>
        <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
      </div>
      <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
  </object>
</div>
<p> </p>
<p> </p>
<p>Verificando     <a href="promo_1.html"> LINK 1</a></p>
<p> </p>
<p>Verificando      <a href="promo_2.html">LINK 2</a></p>
<script type="text/javascript"> 
<!--
swfobject.registerObject("FlashID");
//-->
</script>
</body>

Compartilhar este post

Link para o post
Compartilhar em outros sites

srnetcave    1

srnetcave
Postado

Usando JQuery,

 

Apenas sumir com a imagem

$(document).ready(function(){
  $('#ID_DO_SEU_BOTAO_FECHAR').click(function(){
    $('#ID_DA_SUA_IMAGEM').hide();
  });
});

Se quiser um efeito fade

$(document).ready(function(){
  $('#ID_DO_SEU_BOTAO_FECHAR').click(function(){
    $('#ID_DA_SUA_IMAGEM').fadeOut();
  });
});

Para alterar de invisível para visível e vice versa

$(document).ready(function(){
  $('#ID_DO_SEU_BOTAO_FECHAR').click(function(){
    $('#ID_DA_SUA_IMAGEM').toggle();
  });
});

Usando Javascript sem framework

 

function hideAd(picId)
{
	var picId = document.getElementById(picId);
	picId.style.display = 'none';
}

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito