[js] jak pri najeti na link zobrazit nahled obrazku?

Webdesign, HTML, CSS, Flash, PHP, ASP, .NET, JavaScript. Kritika www stránek na Smetišti.

Moderátor: Moderátoři Živě.cz

Odeslat příspěvekod cobrasoft 5. 1. 2007 00:04

zdravim, mohol by mi niekto helfnut??? potreboval by som javascript ktory mi spravi asi toto: po prejdeni mysou na hyperlink mi zobrazi obrazok (nahlad), ked mysou odidem z linku obrazok zmizne..prosim kto to ma, nech mi to posle..budem mu velmi vdacny...vdaka..

//christian: upraven název threadu. Prostudujte si, prosím, Tipy, jak napsat správný titulek a příště takové thready budu rovnou zamykat
cobrasoft
Kolemjdoucí

Odeslat příspěvekod zero0x 5. 1. 2007 20:57

tu je jednoduchy kod, ktory ti ten obrazok aj da do stredu, vecsinu kodu zabera funkcia na vycentrovanie

funguje v MSIE aj FF

Kód: Vybrat vše
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script>
      function center(obj)
    {
    owidth=obj.offsetWidth;
    oheight=obj.offsetHeight;
   
    pwidth=document.body.clientWidth;
    pheight=document.body.clientHeight;
   
    pleft=(pwidth-owidth)/2;
    ptop=(pheight-oheight)/2;
   
    //presunut objekt
    cleft=pleft+"px";
    ctop=ptop+"px";
   
   
    obj.style.position="absolute";
    obj.style.left=cleft;
    obj.style.top=ctop;
    }
   
    function loadimage(url)
    {
    if(document.getElementById("img-preview")==null)
      {
      imgobj=document.createElement("img");
      document.body.appendChild(imgobj);
      }
    else
      {
      imgobj=document.getElementById("img-preview");
      imgobj.style.display="block";
      }
    imgobj.setAttribute("src",url);
    imgobj.setAttribute("id","img-preview");
    center(imgobj);
    }
   
   
    function hideimage()
    {
    imgobj=document.getElementById("img-preview");
    imgobj.style.display="none";
    }     
    </script>
  </head>
  <body>
  <br /><br /><br /><br /><br />
<a href="#" onmouseover="loadimage('http://forum.zive.cz/templates/alexisOrange/images/logo.gif');" onmouseout="hideimage();">tuu</a>
  </body>
</html>
zero0x
Junior

Odeslat příspěvekod cobrasoft 5. 1. 2007 21:00

vdaka moc kamo, mas to u mna..maj sa, skusim to..naozaj vdaka
cobrasoft
Kolemjdoucí

Odeslat příspěvekod zero0x 6. 1. 2007 17:04

nz, takych skriptov mam na disku plno :) staci ich trochu upravit
zero0x
Junior

Odeslat příspěvekod zero0x 6. 1. 2007 17:35

a tu ti posielam este vylepsenu verziu, kde sa obrazok nezobrazi v strede, ale tam kde je prave kurzor mysi.

Kód: Vybrat vše
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script>
    var imgobj;
    function loadimage(url, e)
    {
    if(document.getElementById("img-preview")==null)
      {
      imgobj=document.createElement("img");
      document.body.appendChild(imgobj);
      }
    else
      {
      imgobj=document.getElementById("img-preview");
      imgobj.style.display="block";
      }
    imgobj.setAttribute("src",url);
    imgobj.setAttribute("id","img-preview");
    moveimage(e);
    }
   
    function moveimage(e)
      {
      var posx = 0;
   var posy = 0;
   if (!e) var e = window.event;
   if (e.pageX || e.pageY)    {
      posx = e.pageX;
      posy = e.pageY;
   }
   else if (e.clientX || e.clientY)    {
      posx = e.clientX + document.body.scrollLeft
         + document.documentElement.scrollLeft;
      posy = e.clientY + document.body.scrollTop
         + document.documentElement.scrollTop;
   }
   // posx and posy contain the mouse position relative to the document
   // Do something with this information
   itop=posy+"px";
   ileft=posx+"px";
   imgobj.style.position="absolute";
   imgobj.style.top=itop;
   imgobj.style.left=ileft;
      }
   
   
    function hideimage()
    {
    imgobj=document.getElementById("img-preview");
    imgobj.style.display="none";
    }     
    </script>
  </head>
  <body>
  <br /><br /><br /><br /><br />
<a href="#" onmouseover="loadimage('http://forum.zive.cz/templates/alexisOrange/images/logo.gif', event);" onmouseout="hideimage();" onmousemove="">tuu</a>
  </body>
</html>
zero0x
Junior

Odeslat příspěvekod cobrasoft 6. 1. 2007 17:40

no kamo, super...diky moc...akurat som na tom pracoval si mi ulahcil pracu :-) ak chces mozes si kuknut moj web kde to pouzijem: http://cobrasoft.tym.sk

este raz vdaka,maj sa
cobrasoft
Kolemjdoucí


Kdo je online

Uživatelé procházející toto fórum: Žádní registrovaní uživatelé a 0 návštevníků