Hogy tudok olyat csinálni, hogy ha egy bizonyos szóra/szövegre ráviszem az egeret, de nem kattintok rá, megjelenik kicsiben a kurzor mellett egy kép?

Egy JQuery-s megoldás:

Először is, töltsd le a jquery.js-t innen:

http://code.jquery.com/jquery-1.4.2.js

Másold ki a tartalmat, és egy szerkesztőbe másold át, majd mentsd el jquery-1.4.2.js néven.

Ezután ezt tedd be a oldalad HEAD címkéi közé:

<script type="text/javascript" src="jquery-1.4.2.js"></script>

Fontos, hogy az imént letöltött JS ugyanabban a könyvtárban legyen, mint ahol a HTML fájlod, ja, és jelen példában jquery-1.4.2.js legyen a neve.

Most másold ki ezt a kódot, majd mentsd el, main.js néven:

this.screenshotPreview = function(){

/* CONFIG */

xOffset = 10;

yOffset = 30;

// these 2 variable determine popup's distance from the cursor

// you might want to adjust to get the right result

/* END CONFIG */

$("a.screenshot").hover(function(e){

this.t = this.title;

this.title = "";

var c = (this.t != "") ? "<br/>" + this.t : "";

$("body").append("<p id='screenshot'><img src='"+ this.rel +"' alt='url preview' />"+ c +"</p>");

$("#screenshot")

.css("top",(e.pageY - xOffset) + "px")

.css("left",(e.pageX + yOffset) + "px")

.fadeIn("fast");

},

function(){

this.title = this.t;

$("#screenshot").remove();

});

$("a.screenshot").mousemove(function(e){

$("#screenshot")

.css("top",(e.pageY - xOffset) + "px")

.css("left",(e.pageX + yOffset) + "px");

});

};

// starting the script on page load

$(document).ready(function(){

screenshotPreview();

});

Ha ez is megvan, akkor a HTML fájl HEAD részébe írjuk ezt is (a JQuery JS meghívása után):

<script type="text/javascript" src="main.js"></script>

Ha ezzel megvagy, akkor másold be ezt a kódot a HTML fájlodba, valahova a BODY elemek közé:

<a href="http://www.gyakorikerdesek.hu" class="screenshot" rel="KÉP_NEVE.JPG">Én egy link vagyok</a>

A lényeg, hogy minden olyan link, amit el akarsz látni ilyen funkcióval, tartalmazza a class="screenshot" és a rel="KÉP_ELÉRÉSI_ÚTVONALA.JPG".

Remélem nem zavartalak össze, és persze hogy működik:)

Hello!

Mindent úgy csináltam, ahogy itt le van írva, de a kép a lap alján jelenik meg, valamit elronthattam? tudná

tok segíteni nekem?

Köszi.