pytanie o obrazek

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
Inx
Posty: 13
Rejestracja: sob sty 27, 2007 3:17 pm
Kontakt:

pytanie o obrazek

Post autor: Inx »

na jednej ze stron widzialem taki fajny efekt..

gdy najechalo sie na link to za chwile pojawial sie obrazek obok linka..

Obrazek

jak zrobic takie coś ??
VeRmin
Nowy
Nowy
Posty: 21
Rejestracja: ndz gru 10, 2006 1:04 pm

Re: pytanie o obrazek

Post autor: VeRmin »

CSS + JavaScript. Wszystko jest w źródle strony.
Inx
Posty: 13
Rejestracja: sob sty 27, 2007 3:17 pm
Kontakt:

Re: pytanie o obrazek

Post autor: Inx »

kod ze stony

Kod: Zaznacz cały

<li><a href="www.onet.pl.html" target="_self"  onmouseover="popup('m_1318')" onmouseout="kill()">German Autobahn</a></li>
jak zrobic u siebie cos takiego ??
VeRmin
Nowy
Nowy
Posty: 21
Rejestracja: ndz gru 10, 2006 1:04 pm

Re: pytanie o obrazek

Post autor: VeRmin »

No już blisko. Zauważ, że są wywołane dwie funkcję "popup()" i "kill()". Ułatwię Ci życie:

http://www.wyspagier.pl/javascript/img_scr_prototype.js

Pod powyższym linkiem są te funkcje zdefiniowane. Będziesz też potrzebował części z poczatku pliku:

Kod: Zaznacz cały

var divName = 'dek'; 
var offX = 16;
var offY = 16;
var imgserv = 'http://twoja_strona.pl';
function mouseX(evt) { ... }
gdzie divName to element blokowy, który musisz wstawić na strone:

Kod: Zaznacz cały

<div id="dek" style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute"></div>
Powodzenia.
Inx
Posty: 13
Rejestracja: sob sty 27, 2007 3:17 pm
Kontakt:

Re: pytanie o obrazek

Post autor: Inx »

probowalem i mi nie wychodzi..
pisze ze sa bledy w skrypcie na stronie
moglbys do mnie napisac na gg: 7773911

z gory dzieki
VeRmin
Nowy
Nowy
Posty: 21
Rejestracja: ndz gru 10, 2006 1:04 pm

Re: pytanie o obrazek

Post autor: VeRmin »

Ehh jeszcze raz:

na stronie musisz mieć tą cześć skryptu JS (bezpośrednio, załączony plik jakkolwiek):

Kod: Zaznacz cały

var divName = 'dek'; 
var offX = 16;
var offY = 16;
var imgserv = 'http://strona_z_forami.pl/'; // lub dodatkowo podfolder do nich 
function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ?  document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;} function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;} function follow(evt) {if (document.getElementById) {var obj = document.getElementById(divName).style; obj.visibility = 'visible'; obj.left = (parseInt(mouseX(evt))+offX) + 'px';  obj.top = (parseInt(mouseY(evt))+offY) + 'px';}} document.onmousemove = follow;

function popup(msg)
{
   var content="<TABLE WIDTH=100 BORDER=1 bordercolor=#C0C0C0 CELLPADDING=0 CELLSPACING=0><TD ALIGN=center><img src='"+imgserv+msg+".jpg' width='100' height='100'></TD></TABLE>";
   document.getElementById('dek').innerHTML = content;
}

function kill()
{
   var content= "";
   document.getElementById('dek').innerHTML = content;
}
I dodatkowo na stronie gdzie to ma być użyte :

Kod: Zaznacz cały

<div id="dek" style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute"></div> 

<!-- 

-->

<a href="www.onet.pl.html" target="_self"  onmouseover="popup('m_1318')" onmouseout="kill()">German Autobahn</a>
Zwróć uwagę na:

Kod: Zaznacz cały

var imgserv = 'http://strona_z_forami.pl/';
To jest adres strony z tymi grafikami które się pokazują.
i na

Kod: Zaznacz cały

onmouseover="popup('m_1318')"
a to 'm_1318' to nazwa pliku.
Jaśniej się nie da ....
ODPOWIEDZ