Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JS] szerokosc i wysokosc IMG
blokern
post
Post #1





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
-----

czesc, mam obrazek na stronie <img src="plik.jpg"> bez okreslonej widht= oraz height=.
w jaki sposob moge wyciagnac informacje na temat szerokosci i wysokosci obrazka w chrome (w ff dziala) bo opcja document.getElementById("fotka").height; i document.getElementById("focia").width; to odpada (IMG:style_emoticons/default/questionmark.gif) ?
dzieki za odpowiedz
Łukasz
Go to the top of the page
+Quote Post
kamil4u
post
Post #2





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

offsetWidth
Go to the top of the page
+Quote Post
blokern
post
Post #3





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
-----

offsetWidth bedzie dzialac jezeli w <img src=""> jest width="".
Twoje rozwiazanie w chromie nie dziala

<img src="abc.jpg" id="focia">

var intElemOffsetWidth = document.getElementById('focia').offsetWidth;
document.write(""+intElemOffsetWidth+"")

wynik w chrome = 0
Go to the top of the page
+Quote Post
kamil4u
post
Post #4





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Odczytaj w takim razie wymiar obrazka w zdarzeniu onload. Chrome pewnie może odczytać wymiar, gdy obraz jest załadowany. Spróbuj dwoma metodami.
Go to the top of the page
+Quote Post
blokern
post
Post #5





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
-----

dzieki za wskazowke

poczynilem

var image = new Image();
image.onload = function() {
// always called
alert(""+image.width+"");
var fiu = image.width;
document.write(""+image.width+"");
};
image.src = 'abc.jpg';

wiesz moze czemu wyswietla sie alert a nastepnie przeladowuje sie strona i wyskakuje wartosc szerokosci ?
chcialbym przekazac wartosc fiu i podac dalej

Ten post edytował blokern 18.01.2012, 23:08:53
Go to the top of the page
+Quote Post
kamil4u
post
Post #6





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Strona nie powinna się przeładowywać...
Opisz problem trochę dokładniej...

W chrome trzeba dać onload, bo z tego co czytałem to szerokość ustalana jest w tej przeglądarce dopiero po wczytaniu obrazka, a nie DOM-u.
Go to the top of the page
+Quote Post
erix
post
Post #7





Grupa: Moderatorzy
Postów: 15 467
Pomógł: 1451
Dołączył: 25.04.2005
Skąd: Szczebrzeszyn/Rzeszów
Cytat
wiesz moze czemu wyswietla sie alert a nastepnie przeladowuje sie strona i wyskakuje wartosc szerokosci ?

Bo używasz document.write podczas, gdy dokument jest już zrenderowany. Zdarzenie onload jest wyzwalane asynchronicznie.
Go to the top of the page
+Quote Post
blokern
post
Post #8





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
----- 

[HTML] pobierz, plaintext 
  1.  
  2. <html>
  3. <head>
  4. </head>
  5. <body>
  6.  
  7. <div id="box">
  8.     <img src="abc.jpg"  alt="tresc">
  9. </div>
  10.  
  11. <script type="text/javascript">
  12. if (document.images) { //sprawdzamy czy przeglądarka obsługuje obiekty images
  13.  
  14. els = document.getElementById('box').getElementsByTagName('img');
  15. for( i=0; el = els[i++];){
  16.  if( el.width >=450 && el.height >=150 ){
  17.  var ok=1;}
  18.      }
  19. </script>
  20. </body>
  21. </html>
[HTML] pobierz, plaintext


w FF dziala w chrome nie (IMG:style_emoticons/default/smile.gif) jezeli wstawie taki skrypt

[html]
var image = new Image();
image.onload = function() {
// always called
alert(""+image.width+"");
var fiu = image.width;
document.write(""+image.width+"");
};
image.src = 'abc.jpg';
[html]

no to wyskoczy mi alert potem przeladuje strone i wyrzuci szerokosc a tak naprawde to ja ta szerokosc chce gdzies podac dalej

pozdrawiam
Łukasz
Go to the top of the page
+Quote Post
kamil4u
post
Post #9





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
----- 

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. </head>
  4. <body>
  5.  
  6. <div id="box">
  7. <img src="abc.jpg" alt="tresc">
  8. </div>
  9.  
  10. <script type="text/javascript">
  11. onload = function(){
  12.  
  13. els = document.getElementById('box').getElementsByTagName('img');
  14. for( i=0; el = els[i++];){
  15. //tu el.width powinno działać wszędzie <-------------------------------------
  16. if( el.width >=450 && el.height >=150 ){
  17. //....
  18. } else {
  19. //....
  20. }
  21. }
  22. }
  23. </script>
  24. </body>
  25. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
blokern
post
Post #10





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
----- 

[HTML] pobierz, plaintext 
  1.  
  2.     <html>
  3.     <head>
  4.     </head>
  5.     <body>
  6.  
  7.     <div id="box">
  8.     <img src="http://www.google.pl/logos/classicplus.png" alt="tresc">
  9.     </div>
  10.  
  11.     <script type="text/javascript">
  12.     onload = function(){
  13.  
  14.     els = document.getElementById('box').getElementsByTagName('img');
  15.     for( i=0; el = els[i++];){
  16.     //tu el.width powinno działać wszędzie <-------------------------------------
  17.     if( el.width >=50 && el.height >=50 ){
  18. 	var ok=1;
  19.  
  20.     } else {
  21.  
  22.     }
  23.     }
  24.     }
  25. 	function ukryj()
  26.     {
  27.       document.getElementById("reklama").style.visibility = "hidden";
  28.     }
  29.     </script>
  30.     </body>
  31.     </html>
  32.  
[HTML] pobierz, plaintext


zamiast wyswietlic fotke a potem tekst "?(IMG:style_emoticons/default/questionmark.gif) " wychodzi co wychodzi, zreszta sam zobacz (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
kamil4u
post
Post #11





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Napisz co chcesz osiągnąć, bo teraz z tym kodem to nic nie wiadomo....

Ten kod odczytuje szerokość obrazka pod każdą przeglądarką....
Kod
<html>
<head>
</head>
<body>

<div id="box">
<img src="http://www.google.pl/logos/classicplus.png" alt="tresc">
</div>

<script type="text/javascript">
onload = function(){

els = document.getElementById('box').getElementsByTagName('img');
for( i=0; el = els[i++];){
alert(el.width);
}
}

</script>
</body>
</html>


Czego nie umiesz zrobić?
Go to the top of the page
+Quote Post
blokern
post
Post #12





Grupa: Zarejestrowani
Postów: 107
Pomógł: 0
Dołączył: 27.02.2008

Ostrzeżenie: (0%)
-----

zamienilem alert na document.write i efekt jest taki ze fotka znika a zamiast fotki pojawia sie wartosc dla width. chce poprostu wyciagnac szerokosc zdjecia i pokazac dalej

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. </head>
  4. <body>
  5.  
  6. <div id="box">
  7. <img src="http://www.google.pl/logos/classicplus.png" alt="tresc">
  8. </div>
  9.  
  10. <script type="text/javascript">
  11. onload = function(){
  12.  
  13. els = document.getElementById('box').getElementsByTagName('img');
  14. for( i=0; el = els[i++];){
  15. document.write(el.width);
  16. }
  17. }
  18.  
  19. </script>
  20. </body>
  21. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
kamil4u
post
Post #13





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Daj w kodzie gdzie chcesz, żeby się wyświetliła szerokość:
[HTML] pobierz, plaintext 
  1. <span id="test"></span>
[HTML] pobierz, plaintext
, a w JS zamiast document.write(el.width);, użyj document.getElementById('test').innerHTML = el.width;

I już (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
« Następny starszy · JavaScript · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 18.09.2025 - 00:56
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn