| Autor | Zpráva | ||
|---|---|---|---|
| MATRAUX Profil |
#1 · Zasláno: 27. 10. 2010, 11:04:41
Dobrý den,
potřeboval bych poradit ohledně automatického spuštění funkce. Mám stránku v HTML kde se zobrazí více DIVů a potřebuji v podstatě něco jako: <DIV onLoad="funkce(this)"> </DIV> Vím, že DIV nepodporuje onLoad. Funkce má za úkol spočítat délku a výšku celého DIVu a následně mu udělat kulaté rohy. Kvůli jednoduchosti a automatizaci funkce pro libovolný počet DIVů chci použít právě "funkce(this)". Předem děkuji za rady. |
||
| _es Profil |
#2 · Zasláno: 27. 10. 2010, 11:11:32
MATRAUX:
„Funkce má za úkol spočítat délku a výšku celého DIVu a následně mu udělat kulaté rohy.“ Nebude jednoduchšie tie oblé rohy spraviť bez JS? |
||
| Chamurappi Profil |
#3 · Zasláno: 27. 10. 2010, 11:18:27 · Upravil/a: Chamurappi
Reaguji na MATRAUXe:
Též mi připadá jako špatný nápad řešit kulaté rohy přes JavaScript. Jinak nejjednodušší způsob, jak zajistit spuštění kódu po načtení určitého úseku HTML kódu, je dát ten skript za dotyčný úsek kódu. Ovšem to neodpovídá přesně tomu, jak funguje událost onload — ta (na <body>) čeká i na načtení <img> atd., kdežto skript povalující se „jen tak“ v kódu se spustí hned, jak se k němu dostane HTML parser.
|
||
| MATRAUX Profil |
#4 · Zasláno: 28. 10. 2010, 01:23:56
_es:
Určitě to nebude jednoduší, musel bych do každého jinak velkého DIVu vkládat další DIVy které dělají oblé rohy. viz www.matraux.ic.cz/test2.html Chamurappi: no ale právěže když ten script hodím za ten DIV tak to nebude moct být automaticky řešeno přes nějakou funkci(this) ale musel bych tam třeba dát funkce(DIV1)...funkce(DIVn). A to právě nechci. Ještě mě napadlo řešit to přes while, postupně by se dotazoval na DIV1 až DIVn, splňoval požadovanou funkci. Ale to by každý ten DIV musel mít číslování a nesměl bych vynechat. |
||
| Tori Profil |
#5 · Zasláno: 28. 10. 2010, 02:27:02
MATRAUX:
„další DIVy které dělají oblé rohy.“ Trochu moc jich tam máte... nestačily by dva vnořené divy, cca 8px vysoké přes celou šířku nadřazeného divu, které by dělaly celé rohy vždy na obou stranách zároveň? (a když by ty rohy byly dělané grafikou na pozadí, tak by to nemuselo být tak kostrbaté). Anebo pro každý roh jeden malý čtvercový div, čímž to bude použitelné na libovolné rozměry velkého divu. Určitě se to tu několikrát řešilo. |
||
| MATRAUX Profil |
#6 · Zasláno: 28. 10. 2010, 02:42:19
Tori:
Pouze dva 8px DIVy by byly ještě kostrbatější. Mimochodem všechny DIVy v tvoří oblé roky na obou stranách zároveň ( 4x horní pravý/levý; 4x dolní pravý/levý). Dělat pro každý roh čtvercový DIV je myslím ještě víc složitější. Oblé rohy přes JS dělám z toho důvodu abych nemusel používat grafiku. Libovolný rozměr jednoduše dopočítává přímo JS. Nicméně jsem to téměř vyřešil, nakonec podle rady od Chamurappi jsem umístil za DIV <div id="id divu">
<script>funkce('id divu');</script>
nějaký text
</div>viz http://matraux.ic.cz/test3.html Pokud by jste měli někdo výhrady k délce kódu JS budu rád když poradíte =) |
||
| _es Profil |
#7 · Zasláno: 28. 10. 2010, 06:43:17
MATRAUX:
Keď už to chceš robiť JavaScriptom, tak to radšej sprav na konci načítania stránky nejakým cyklom naraz. |
||
| Witiko Profil |
#8 · Zasláno: 28. 10. 2010, 09:55:54
_es:
„Keď už to chceš robiť JavaScriptom...“ +1 Uložit elementy do pole a pak najednou je zpracovat, aby se prohlížeč z X asynchronních onload volání nezbláznil. |
||
| MATRAUX Profil |
#9 · Zasláno: 28. 10. 2010, 13:26:05
Witiko:
Uložit elementy do pole a pak najednou je zpracovat, aby se prohlížeč z X asynchronních onload volání nezbláznil. No jo ale to je právě to co jsem nechtěl, těch tabulek bude dost a psát ke každé ID a pak to ID ještě opisovat do pole. Ztrácí to pak tu myšlenku automatizace. Teď nastává problém, co když zapomenu na nějaký ten element, to pak vyhodí chybu a script se celý ukončí, když nebude element nalezen. Potřebuji aby to bylo ve výsledku co nejjednodušší. |
||
| _es Profil |
#10 · Zasláno: 28. 10. 2010, 13:59:17
MATRAUX:
„těch tabulek bude dost a psát ke každé ID a pak to ID ještě opisovat“ A toto: <div id="id divu">
<script>funkce('id divu');</script>
nějaký text
</div>[b][/b]„Ztrácí to pak tu myšlenku automatizace.“ Ten predchádzajúci kód veľmi automatizáciu nepripomína. „co když zapomenu na nějaký ten element, to pak vyhodí chybu a script se celý ukončí, když nebude element nalezen.“ To, či element existuje sa dá otestovať. V JS sú metódy na zistenie existujúcich elementov. Chyby sa dajú zachytiť. |
||
| Witiko Profil |
#11 · Zasláno: 28. 10. 2010, 15:32:30
MATRAUX:
Co takhle přiřadit daným elementům specifický name / class a pak je všechny pomocí getElementsByName / getElementsByClassName (na některých prohlížečích nutné doimplementovat) posbírat a provést u nich změnu? To mi zní velmi elegantně. |
||
| MATRAUX Profil |
#12 · Zasláno: 28. 10. 2010, 19:16:59
_es:
Samozřejmně tohle je jen testovní kód, ten se mi vůbec nelíbí a také mu chybí automatizace a vůbec je to hrozný. Witiko Podle toho ClassName to nevypadá špatně. Mohl by jsi prosimtě předvést nějaký příklad? Nevím vůbec jak bych měl začít. Děkuju. |
||
| Witiko Profil |
#13 · Zasláno: 28. 10. 2010, 21:56:41
Na prohlížečích, kde funkce je je použití velmi snadné, document.getElementsByClassName(třída) navrátí pole všech elementů dané třídy. Způsob doimplementace do prohlížečů bez nativní podpory se řešil například tady.
|
||
| Chamurappi Profil |
#14 · Zasláno: 28. 10. 2010, 23:27:03
Reaguji na MATRAUXe:
„musel bych do každého jinak velkého DIVu vkládat další DIVy které dělají oblé rohy“ To je nějaký problém? „Oblé rohy přes JS dělám z toho důvodu abych nemusel používat grafiku.“ Proč nemůžeš používat grafiku? To, že jde rohy udělat bez obrázků, ještě neznamená, že to je dobrý nápad. „když ten script hodím za ten DIV tak to nebude moct být automaticky řešeno přes nějakou funkci(this) ale musel bych tam třeba dát funkce(DIV1)…funkce(DIVn)“ Nemusel. Mohl bys upravovat vždy ten poslední <div> v dokumentu.
Koukám na ten tvůj skript: var width = div.style.width;
var width = width.split('px');
var width = width[0];vařená šířka. Místo jednoduchého var width = parseFloat(div.style.width)…
Proč upravuješ tolikrát innerHTML? Necháš prohlížeč, ať ti pokaždé převede DOM do HTML, přilepíš k němu kousíček kódu, probudíš HTML parser, řekneš mu, ať celé to HTML zase převede na DOM… a takhle devětkrát. Nestačilo by to jednou?
Reaguji na Witika: „Co takhle přiřadit daným elementům specifický name / class a pak je všechny pomocí getElementsByName / getElementsByClassName“ S tím name to na <div>u nebude fungovat.
|
||
| Witiko Profil |
#15 · Zasláno: 28. 10. 2010, 23:33:49 · Upravil/a: Witiko
Chamurappi:
I beg to differ? <div name = "aaa"></div>
<div name = "aaa"></div>
document.getElementsByName("aaa").length == 2Pokuds to tedy nemyslel jinak. :) |
||
| Chamurappi Profil |
#16 · Zasláno: 29. 10. 2010, 00:10:55
|
||
| Witiko Profil |
#17 · Zasláno: 29. 10. 2010, 00:15:48
Chamurappi:
Ok, rozumím. Ono stejně celkovému pseudo-CSS efektu prospěje, pokud se to bude řešit přes className. Problémem je, že u prohlížečů bez nativní podpory může jít o celkem resources-žeroucí funkci. Proto si pro účely scriptu doporučuji funkci z http://diskuse.jakpsatweb.cz/?action=vthread&forum=8&topic=110958 upravit tak, aby nehledala veškeré elementy, ale jen divy. |
||
| MATRAUX Profil |
#18 · Zasláno: 30. 10. 2010, 17:53:44
Chamurappi:
To je ale pečlivě uvařená šířka. Místo jednoduchého var width = parseFloat(div.style.width)… Proč upravuješ tolikrát innerHTML? Necháš prohlížeč, ať ti pokaždé převede DOM do HTML, přilepíš k němu kousíček kódu, probudíš HTML parser, řekneš mu, ať celé to HTML zase převede na DOM… a takhle devětkrát. Nestačilo by to jednou? Bohužel dělám s Javascriptem teprve asi 3/4 roku tak nemohu znát všechny funkce a ani neznám v okolí nikoho kdo by se JS zabýval. Chamurappi: Proč nemůžeš používat grafiku? To, že jde rohy udělat bez obrázků, ještě neznamená, že to je dobrý nápad. Vzhledem k optimalizaci webu. Navíc tam bude už tak dost obrázků a potřebuji opravdu ušetřit každý bajt. (beru v potaz, že ty obrázky oblých rohů moc nebudou zabírat ale přesto bych to rád řešil buď přes CSS nebo JS) Místo otázek proč to neudělám tak a tak bych spíš uvítal nějaké vhodné řešení. "document.getElementsByName" je tato funkce vůbec podporována všemi prohlížeči ? Nicméně děkuji za upozornění na funkci "parseFloat" =) |
||
| MATRAUX Profil |
#19 · Zasláno: 30. 10. 2010, 19:25:32
Takže jsem to nakonec vyřešil možná složitě možná jednoduše.
funkce document.getElementsByTagName funguje na všech prohlížečích bezproblémově. (aspoň v to doufám ale jede to i na IE 6) ale byl bych rád kdyby jste to zhodnotili a případně řekli co by se dalo zkrátit a zjednodušit, budu rád. www.matraux.ic.cz/test3.html |
||
|
Časová prodleva: 13 let
|
|||
0