Üdv.
Volna egy olyan problémám, hogy az oldalamon a funkciókat firefox rendesen végrehajtja, viszont chrome, vagy bármi más böngésző pedig nem.
http://pastebin.com/UfxRYtzK
(A bizonyos funkció)
Nem tudok rájönni, hogy mi lehet a gond :/
Ha a CSS - bol a text-indent - et kiveszed (amirol gozom sincs, hogy mi), az id - ket "" koze teszed, akkor mukodik, illetve nalam mukodott.
En orulok, hogy ez erdekel, es probalkozol, de had legyek oszinte: Ez igy nagyon nem jo. Ha elfogadsz nehany tanacsot:
- Tanulas celjabol szoktak azt mondani, hogy legyen a JS/CSS/HTML egy fajl - ban, mert "atlathato". Meg a nagy fraszt, atlathatatlan lesz tole, jobb ha mar az elejen hozzaszokik az ember a szeparalasukhoz
- Tudom, hogy a bongeszo sok mindent elrendez anelkul, hogy mi barmit is csinalnank, de illik kovetni a szabvanyokat, es az alapjan dolgozni, igy jobban garantalhato manapsag, hogy ugyanugy fog megjelenni kulonbozo bongeszokon is az oldal
- A JS - bol kicsit komplikalt CSS - t modositani, ezert szoktak a style attributummal feluldefinialni a CSS - ben foglaltakat. Ettol fuggetlenul HTML - be nem kell se style, se font (errol se tudom, hogy honnan jott), se egyeb, erre valo a CSS, menjen minden oda
- HTML - ben nem szoktunk esemenykezelo fuggvenyeket rendelni tag - ekhez, se barmilyen JS variaciot belegyomoszolni, igaz jopar JS framework erre nevel a template - kkel, nyugodtan fol lehet oket rugni. Alternativa? A JS fuggvenyeid 1 kaptafara epulnek, illik oket kiemelni. Az esemenykezelo fuggvenyt pedig hozzarendeljuk adott HTML tag - hez, valahogy igy:
window.onload = function() {
document.body.addEventListener('click', function(event) {
if(event.target.id === 'valami') {...}
}, false);};
Ez persze HTML - ben okosabb csoportositast igenyel, bevezetnek meg 2 DIV - et.
- Utolso kritikus eszrevetel az a CSS - el kapcsolatos, azt jol latod, hogy meglehet adni CSS szelektorokat, de nem igy. Ha mar van ID - je egy adott HTML tag - nek, akkor boven eleg azon keresztul elerni azt, igy:
.map_image {}
.map_link {}
#map_link_0 {}
#map_link_2 {}
Remelem ez osztonoz es nem eltantorit! A valosag az, hogy bonyolult vilag ez, nem szabad lebecsulni es "csak mukodjon" alapon hozzaallni. ;)
UP
Egy utolso, nem tul ujito gondolat: JS - ben mukodnek a C++ - os kommentek, nem kell oda az a HTML komment
Köszönöm szépen a segítséged és a tanácsaid is.
Igyekszek megfogadni a tanácsaid és azok alapján dolgozni a továbbiakban.
Mivel hobby szinten tanulom, így elég sokszor csinálok hülyeséget :/ :) De a későbbiekben remélhetőleg már jobban fog menni. :D
Ja és a "text-indent" az arra szolgál, hogy a "térképen" a megjelölt pontok nevét írja-e ki, vagy ne.
Kép:
http://kepfeltoltes.hu/131117/text_www.kepfeltoltes.hu_.jpg (http://kepfeltoltes.hu/131117/text_www.kepfeltoltes.hu_.jpg)
Igen, en ugye kepek nelkul egy szep fekete oldalt kaptam. Kicsit meg kellett reszelnem, hogy valamit lassak belole.
Az aminek a kod alapjan mukodnie kell, az nalam mukodik. (Szovegre kattintok, megjelenik 1 be nem nem toltodott kep es 1 szoveg, ha a kepre kattintok, eltunnek.) Az mas kerdes, hogy ez az a mukodes amit elvarsz az oldaltol.
Hmmm... Valahogy nem akarja az igazságot....
Rendben, akkor tisztazzuk a dolgot. Ird le, hogy mit szeretnel kihozni a dologbol, pl.: ide kattintok, ez tortenik, ez itt jelenik meg, stb., mert ugy tunik, hogy csak a kod alapjan felreertjuk egymast.
Ne haragudj, megvan amit akartam. Este van aztán nem látok a szememtől :/
Semmi gond. En valami ilyesmire gondoltam (en se vittem tulzasba):
<!DOCTYPE html>
<html>
<head>
<script text="text/javascript">
window.onload = function() {
document.body.addEventListener('click', function(event) {
var target = event.target;
if(typeof target !== undefined) {
if(target.id === 'first') {
var obj = document.getElementsByTagName('IMG')[0];
obj.style.visibility = 'visible';
}
else if(target.id === 'second') {
var obj = document.getElementsByTagName('IMG')[1];
obj.style.visibility = 'visible';
}
else if(target.tagName === 'IMG') {
target.style.visibility = 'hidden';
}
}
}, false);
};
</script>
</head>
<body>
<p id="first">First</p>
<p id="second">Second</p>
<img src="test.png" style="visibility:hidden;"><br>
<img src="test.png" style="visibility:hidden;"><br>
</body>
</html>