HTML-szerkesztés kezdőknek!!!
-
#5104
Kis módosításssal:
<script type="text/javascript">
function d(obj) {
return document.getElementById(obj) != null ? document.getElementById(obj) : false;
}
function getElementsByClass(name) {
var found = 0;
var elems = new Array();
var alltags = document.getElementsByTagName("*");
if (alltags) {
for (i=0; i < alltags.length; i++) {
if (new RegExp('\\b'+name+'\\b').test(alltags[i].className)) {
elems[found++]=alltags[i];
}
}
}
return(elems);
}
function addEventHandler(obj, eventType, handler) {
if (window.opera && obj.addEventListener) {
obj.addEventListener(eventType, handler, false);
return true;
} else if (obj.addEventListener) {
obj.addEventListener(eventType, handler, true);
return true;
} else if (obj.attachEvent) {
var r = obj.attachEvent("on"+eventType, handler);
return r;
} else {
return false;
}
}
function init() {
if (document.layers) {
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = captureMousePosition;
} else if (document.all) {
document.onmousemove = captureMousePosition;
} else if (document.getElementById) {
document.onmousemove = captureMousePosition;
}
xMousePos = 0;
yMousePos = 0;
xMousePosMax = 0;
yMousePosMax = 0;
}
function captureMousePosition(e) {
if (document.layers) {
xMousePos = e.pageX;
yMousePos = e.pageY;
xMousePosMax = window.innerWidth+window.pageXOffset;
yMousePosMax = window.innerHeight+window.pageYOffset;
} else if (document.all) {
xMousePos = window.event.x+document.body.scrollLeft;
yMousePos = window.event.y+document.body.scrollTop;
xMousePosMax = document.body.clientWidth+document.body.scrollLeft;
yMousePosMax = document.body.clientHeight+document.body.scrollTop;
} else if (document.getElementById) {
xMousePos = e.pageX;
yMousePos = e.pageY;
xMousePosMax = window.innerWidth+window.pageXOffset;
yMousePosMax = window.innerHeight+window.pageYOffset;
}
xMousePos = xMousePos + 20;
yMousePos = yMousePos + 20;
}
function show_box() {
d('infobox').style.visibility = 'visible';
d('infobox').style.display = 'block';
}
function hide_box() {
d('infobox').style.visibility = 'hidden';
d('infobox').style.display = 'none';
}
function boxevents() {
var up = getElementsByClass('link');
for (i=0; i < up.length; i++) {
up[i].firstChild.onmousemove = function(){
d('infobox').style.left = xMousePos+'px';
d('infobox').style.top = yMousePos+'px';
}
up[i].firstChild.onmouseover = function(){
show_box();
d('infobox').innerHTML = '<img src=\"kep.jpg\" alt=\"Képaláírás\">';
}
up[i].firstChild.onmouseout = function(){
hide_box();
}
}
}
addEventHandler(window,'load',init);
addEventHandler(window,'load',boxevents);
</script>
Minden linknek legyen class attribútuma link értékkel:
<a href="oldal.htm" class="link">Ez egy link</a>
Illetve legyen egy üres infobox ID-jú <div>:
<div id="infobox"></div>