Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][JavaScript]błąd z wyświetlaniem obrazka
Forum PHP.pl > Forum > Przedszkole
anderson20
Na stronie jest taki kod:
Kod
<BR><script type="text/javascript"><BR>       function otworz(adres) {<BR>       noweOkno = window.open(adres, '', 'menubar=no, toolbar=no, location=no, scrollbars=yes, resizable=yes, width=820, height=740, top=0, left=30');<BR>       }<BR></script><BR>

który powoduje, że jak dam odwołanie:
Kod
<BR><a href="javascript:otworz('obrazki/1.htm')">obrazek1</a><BR>

to powinno mi się wyświetlić nowe okno z obrazkiem.
Obrazek jest wielkości np. 1600x1024 albo innej, jednym słowem różnej są wielkości, dlatego kombinowałem, aby okno otwierające było zawsze takiej samej wielkości 820x740 i obrazek zawsze w nim takiej samej szerokości (aby względem szerokości się modyfikował z zachowaniem proporcji), woboc tego stworzyłem jeszcze plik .css z takim odwołaniem:
Kod
<BR>#img {<BR> margin-bottom: 10px;<BR> max-width: 800px;<BR> width: expression(Math.min(parseInt(this.offsetWidth), 800 ) + "px");<BR>}<BR>


i w pliku 1.htm (czyli nowym oknie) odwołuję się do obrazka.
Jedna linijka max-width: 800px; zapewnia mi modyfikację obrazka np. w operze a ta na samym dole w IE.
Efekt moich kodów:
http://www.imageshock.eu/?img=3465500~problemik.jpg
Obrazek się strasznie mały wyświetla. Jak się naciśnie DALEJ i potem WSTECZ to ten sam obrazek się już dobrze wyświetla!!! Dlaczego przy pierwszym otwarciu taki mały sie wyświetla a nie od razu dopasowany do okna?questionmark.gif? Jak się zamknie okno z obrazkiem i ponownie wczyta to też dobrze się wyświetla. Chodzi o ten pierwszy raz, co zrobić aby przy pierwszym otwarciu był dopasowany do okna?questionmark.gif
sticker
pokaż kod 1.html
anderson20
kod 1.htm
Kod
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
      <title>"Zdjęcie nr 1 (1/22)"</title>
      <meta content="text/html; charset=iso-8859-2" http-equiv="Content-Type">
      <meta name="keywords" content="costam">
      <meta name="description" content="costam2">

<link rel="Stylesheet" type="text/css" href="../styl.css">
</head>

<body style="margin: 0; padding: 0">
   <div id="body">
      <div id="zdjecie">
            <div class="stronicowanie" style="white-space: nowrap">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1/22&nbsp;&nbsp;&nbsp;
            <a href="2.htm">Dalej</a>
            </div>
            <br />
            <div style="text-align: center">
               <img id="img" src="1.jpg">
            </div>
      </div>
   </div>
</body>
</html>


A kod całego pliku styl.css
Kod
body {
font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
}

.zdjecie {
padding: 10px;
text-align: justify;
}

h1 {
text-align: center;
font-size: 24px;
margin: 0;
padding-bottom: 10px;
padding-top: 10px;
}

#img {
margin-bottom: 10px;
max-width: 800px;
width: expression(Math.min(parseInt(this.offsetWidth), 800 ) + "px");
}

.stronicowanie {
text-align: center;
margin-top: 1em;
font-weight: bold;
}
.stronicowanie a:link, .stronicowanie a:visited {
color: blue;
text-decoration: none;
}
.stronicowanie a:hover {
color: red;
}

.tekst {
text-align: center;
font-weight: bold;
font-size: 14px;
}


w którym najważniejsza linijka to ta z #img.
Zauważyłem, że tylko w IE otwiera taki maluczki obrazek a w operze już jest ok, dopasowany do okna, więc coś trzeba jakoś tą funkcje przerobić:
Kod
width: expression(Math.min(parseInt(this.offsetWidth), 800 ) + "px");

aby w IE dostosowywała obrazek do nowo otwartego okna.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.