| Autor | Zpráva | ||
|---|---|---|---|
| xlifer Profil |
#1 · Zasláno: 10. 8. 2011, 20:19:34 · Upravil/a: xlifer
Lze načíst rozměr obrázku na který odkaz směruje?
<a href="obrazek.jpg" id="obrazek" onclick="return rozmer(this.id);">obrazek</a>
<script type="text/javascript">
function rozmer(idecko) {
var pic = document.getElementById(idecko);
var h = pic.height;
var w = pic.width;
alert(w+'x'+h);
return false;
}
</script> |
||
| xlifer Profil |
#2 · Zasláno: 10. 8. 2011, 20:33:38 · Upravil/a: xlifer
Funkční řešení v IE, ale nejede ve FF ?
<script type="text/javascript">
function rozmer(idecko) {
var pic = document.getElementById(idecko);
var Npic = new Image();
Npic.src = pic;
var h = Npic.height;
var w = Npic.width;
alert(w+'x'+h);
return false;
}
</script> |
||
| DarkMeni Profil |
#3 · Zasláno: 10. 8. 2011, 21:08:18 · Upravil/a: DarkMeni
Zkus toto
function getImageSize(src, resultPostTo, response){
var picture = new Image();
picture.onload = (function(resultPostTo){
return function(){
resultPostTo([this.width, this.height]);
}
})(resultPostTo);
picture.src = src;
if(response instanceof Function){
response();
}
return true;
}
Možná ti to pomůže, nejdřív se načte obrázek a po načtení provede funkci z druhého argumentu (v případě třetího argumentu to ještě okamžitě provede funkci v něm (musí to být funkce)).
//Jednoduché použití:
function alertSize(size){
alert(size[0]+"x"+size[1]+" | "+Math.round((size[0]*size[1])/1000000)+"Mpx");
}
function alertLoading(){
alert("Počkejte prosím, načítám obrázek...");
}
//V html:
<a href="obrazek.jpg" onclick="return !getImageSize(this.href, alertSize);">Obrázek</a>
//Složitější v html:
<a href="obrazek.jpg" onclick="return !getImageSize(this.href, alertSize, alertLoading);">Obrázek</a>
Kdyby si tu funkci použil tak to po načtení obrázku zavolá funcki z druhého argumentu (to musí být proměnná pro funkci) a jako jeden argument jí dá dvouprvkové pole s [0]=> šířka obrázku | [1]=> výška obrázku. |
||
| xlifer Profil |
#4 · Zasláno: 10. 8. 2011, 22:27:35
DarkMeni:
Díky moc, jdu to vyzkoušet... |
||
| xlifer Profil |
#5 · Zasláno: 10. 8. 2011, 23:59:47 · Upravil/a: xlifer
DarkMeni:
A proč to musí jít přes ty funkce na picture.onload ? Když vynechám funkce a použiju pouze alert(picture.onload); tak to funguje taky, ale pouze v případě, že tam nechám alert jinak to zase hází 0x0 rozměr. var picture = new Image(); picture.src = idFotka; alert(picture.onload); // když oddělám zde alert, tak to již nefunguje, zkoušel jsem naplnit true, ale nezabíra to var h = picture.height; var w = picture.width; alert(w+' x '+h); |
||
| peta Profil |
#6 · Zasláno: 11. 8. 2011, 07:16:35
xlifer: Protoze IE a FF zpracovava JS odlisne. FF, az kdyz ho potrebuje a nacitani obrazku je casova udalost s neurcitym koncem. Po jeho nacteni se vygeneruje udalost onload. Kdezto script bezi dal nezavisle na casove udalosti. U IE nastava to, ze IE si zpracovava scripty jeste pred pouzitim na stranku, takze v tomto pripade nejspis stihne nacist obrazek drive nez prirazuje rozmery.
Alert je taky casova udalost, ktera ale zastavi dalsi zpracovani. Po odkliknuti alertu script pokracuje dal. Ty 2s nez na to kliknes, staci, aby se obrazek dostahoval a tudiz nasledujici script uz muze zjistovat jeho rozmery. Lze to tez obejit php, ze mu posles rozmery a jmeno obrazky, pak nemusis davat onload, protoze rozmery znas. |
||
| _es Profil |
#7 · Zasláno: 11. 8. 2011, 07:47:03 · Upravil/a: _es
DarkMeni:
> var picture = new Image(); > picture.src = src; > picture.onload = To je nesprávne nastavenie udalosti. Najprv treba priradiť nejakú funkciu do vlastnosti onload, až potom načítať obrázok. Inak hrozí, že sa obrázok môže načítať z cache ešte pred nastavením udalosti. |
||
| DarkMeni Profil |
#8 · Zasláno: 11. 8. 2011, 10:45:28
A jo, máš pravdu, díky, upravil jsem to.
|
||
| xlifer Profil |
#9 · Zasláno: 11. 8. 2011, 20:21:04
Z toho celého je asi nejlepší řešení jak píše peta, posílat z php přímo rozměry obrázku do funkce JS, protože se mi nepodařilo nikde sestavit funkční řešení bez alertu? Myslel jsem, že je taková záležitost možná vyřešit v JS jednoduše, ale asi ne...
|
||
| xlifer Profil |
#10 · Zasláno: 11. 8. 2011, 20:52:56
Zeptám se, zda bude aspoň něco takového fungovat. Napsal jsem to z hlavy jako myšlenku, takže nekamenujte mne, v případě, že by kód vůbec nefungoval, protože jsem na něco zapoměl :-)
Nicméné záměr myšlenky je takový, že bych chtěl pověsit v JS na setTimeout funkci, která počká až obrázek bude dostupný na události onload. Pokud to není moc k pochopení, zkusím to ještě nějak upřesnit. <div id="blok">
<img src="obrazek.gif" width="100" height="100" id="obrazek">
</div>
<script>
function jeNacteno(idecko) {
var pic = document.getElementById(idecko);
if (pic.onload) {
function anoNacteno();
}
}
setTimeout(jeNacteno,200);
</script> |
||
| Chamurappi Profil |
#11 · Zasláno: 11. 8. 2011, 20:58:50
Reaguji na xlifera:
Pěkně se v tom topíš. „Myslel jsem, že je taková záležitost možná vyřešit v JS jednoduše“ Je. DarkMeni ti i napsal řešení. Všechno, co potřebuješ vědět, je tu už napsáno. „že bych chtěl pověsit v JS na setTimeout funkci, která počká až obrázek bude dostupný na události onload“ To je paráda, ale událost je událostí od toho, že se vyvolá ve vhodný okamžik sama. Do vlastnosti pic.onload bys měl přiřadit funkci, kterou chceš vykonat po načtení… k tomu slouží. Rozhodně z ní nic rozumného nevyčteš.
|
||
| xlifer Profil |
#12 · Zasláno: 11. 8. 2011, 21:35:17 · Upravil/a: xlifer
Chamurappi:
„Je. DarkMeni ti i napsal řešení. Všechno, co potřebuješ vědět, je tu už napsáno.“ Nevím jestli jsem pochopil, ale řešení na to jak oddělat alert uvedeno není a s tím funkce je nepoužitelná, takže řešení není... nebo ano, pak jsem mimo. „To je paráda, ale událost je událostí od toho, že se vyvolá ve vhodný okamžik sama. Do vlastnosti pic.onload bys měl přiřadit funkci, kterou chceš vykonat po načtení… k tomu slouží. Rozhodně z ní nic rozumného nevyčteš.“ Jak jsem psal, kód byl pouze nástřel myšlenky, takže hlavní účel splnila, že byla pochopena :-) Ale díky za upozornění a doporučení jak na to. |
||
| Chamurappi Profil |
#13 · Zasláno: 11. 8. 2011, 22:31:24
Reaguji na xlifera:
„řešení na to jak oddělat alert uvedeno není“ Vždyť tam žádný nemá. Jediné alerty, které u něj vidím, jsou tam jen jako ukázka nakládání se získanými informacemi.
|
||
| xlifer Profil |
#14 · Zasláno: 11. 8. 2011, 22:35:19
Chamurappi:
Aha, tak už si sypu popel na hlavu já. Omluva a velké díky DerkMeni. |
||
| xlifer Profil |
#15 · Zasláno: 11. 8. 2011, 23:17:57 · Upravil/a: xlifer
Chamurappi:
„To je paráda, ale událost je událostí od toho, že se vyvolá ve vhodný okamžik sama. Do vlastnosti pic.onload bys měl přiřadit funkci, kterou chceš vykonat po načtení… k tomu slouží. Rozhodně z ní nic rozumného nevyčteš.“ Prosím tě, tohle jsem už taky vyřešil a pochopil, ale nevím proč se mi v IE stává, že když po sobě 2x vyvolám funkci, která je přidělená na pic.onload , tak se neprovede? Ve FF mi to nedělá. Lze to nějak nullovat pro případné opakování? Díky za odpověď. |
||
| Chamurappi Profil |
#16 · Zasláno: 11. 8. 2011, 23:20:22
Reaguji na xlifera:
„proč se mi v IE stává, že když po sobě 2x vyvolám funkci s pic.onload“ Jak ji vyvoláváš? Nějak ti nerozumím, ty ji volat nemáš, ona se volá sama při načtení, od toho je to přeci událost. |
||
| xlifer Profil |
#17 · Zasláno: 11. 8. 2011, 23:34:06 · Upravil/a: xlifer
Chamurappi:
„Jak ji vyvoláváš? Nějak ti nerozumím, ty ji volat nemáš, ona se volá sama při načtení, od toho je to přeci událost.“ Vyvolá se sama po načtení, ano, tak to je, ale když to stejné se má provést jakoby znovu, tak už nejde. Provést znovu myslím 2x kliknutí po sobě na ten odkaz co vyvolá opět funkci. Zkusím to vysvětlit kódem, třeba bude věc lépe k pochopení: <a href="obrazek.jpg" onclick="fA(this.href)">
<script>
function fA(obr) {
var pic = new Image();
pic.src = obr;
pic.onload = function(){jeNahran();};
function jeNahran() {
// neco
fB();
}
funkce fB() {
// neco
}
}
</script> |
||
| YoSarin Profil |
#18 · Zasláno: 11. 8. 2011, 23:39:56
xlifer:
Přečti si komentář [#7] od _es - DarkMeni po něm upravil svůj kód a ty už jsi tu změnu neprovedl. Stává se ti patrně přesně to, co es_ popsal. |
||
| xlifer Profil |
#19 · Zasláno: 11. 8. 2011, 23:45:00
YoSarin:
Ano! To je přesně ono, tohle jsem nějak přehlédl. Díky moc za nakopnutí. |
||
|
Časová prodleva: 13 let
|
|||
0