Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP][CSS]Obrazek, zdjęcia zamiast tekstu w wyskakującym okienku
Forum PHP.pl > Forum > Przedszkole
ciapus4
Witam, jaki kod dołączyć, żeby zamiast tekstu wstawić jakiś obrazek, lub pod tekstem dodać obrazek.
Przykład kodu
Kshyhoo
Powiedz, że to żart.
  1. <div id="dialog" title="INFORMACJA">
  2. <img style="width: 80px; height: 80px;" src="http://forum.php.pl/uploads/av-63889.png" alt="" height="80" border="0" width="80">
  3. </div>
Luna_s20
Eh.. .ty serio to? ohmy.gif

To najbardziej podstawowe podstawy. Bardziej podstawowe jest już tylko przeglądanie stron.

Zamiast tekstu lub pod nim wstaw

  1. <img src="http://adres_strony.pl/ścieżka_do_obrazka/nazwa_obrazka" title="Tytuł obrazka" alt="Tekst alternatywny"/>


Jeśli chcesz nadać obrazkowi odgórnie atrybuty wielkości to wstaw gdzieś w środek odpowiednie znaczniki, np
  1. <img src="http://adres_strony.pl/ścieżka_do_obrazka/nazwa_obrazka" width="250" height="150" title="Tytuł obrazka" alt="Tekst alternatywny"/>


albo za pomocą css, przypisując klasę:
  1. <img class="obrazek" src="http://adres_strony.pl/ścieżka_do_obrazka/nazwa_obrazka" title="Tytuł obrazka" alt="Tekst alternatywny"/>

  1. .obrazek{
  2. width: 250px;
  3. height: 250px;
  4. }
ciapus4
Wielkie TNX, używam kodów sporadycznie, ale mniejsza z tym, jak wycentrować napis "INFORMACJA" i obrazek w okienku ?

kod
Kshyhoo
Chyba Ci zamknę ten wątek:) Takie proste rzeczy można w Google znaleźć:
  1. <div id="dialog" title="INFORMACJA" style="text-align: center">
  2. <img src="http://www.restauracjemaciek.pl/gfx/n_index_01.jpg" width="250" height="150" title="Tytuł obrazka" alt="Tekst alternatywny"/>
  3. </div>


W pliku, który dołączasz:
  1. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

jest:
  1. .ui-dialog .ui-dialog-title {
  2. float: left;
  3. margin: .1em 0;
  4. white-space: nowrap;
  5. width: 90%;
  6. overflow: hidden;
  7. text-overflow: ellipsis;
  8. }

Musiałbyś float: left; zamienić na text-align: center;.
ciapus4
Nie tylko nie to facepalmxd.gif , nie zamykaj, jeszcze zapytam, możesz podpowiedzieć w takim razie, pewnie nie da się zmienić tego kodu co podałeś,
"Musiałbyś float: left; zamienić na text-align: center;.". Napiszę tak, po wpisaniu adresu strony głównej, chciał bym, żeby wyskoczyło takie okno jak w przykładzie z obrazkiem w odpowiednim rozmiarze .width="450" height="350".jak daje takie parametry to pokazują się suwaki....jak tu. Czy można to jakoś zedytować, bądz mogę kod umieścić na swym serwerze gdzie jest kod stronki, prosze o wyrozumiałośc wstydnis.gif
Kshyhoo
Pokazują się suwaki, bo rozmiar obrazka jest większy od otaczającego DIVa.
ciapus4
Ok, więc jak to zmienić, żeby pozbyć się suwaka ?
Kshyhoo
Wszystko jest w pliku, ktory dołączasz:
http://code.jquery.com/ui/1.10.3/themes/sm...s/jquery-ui.css
Więc nie możesz ingerować. Musisz przeczytać, jak to zrobić w dokumentacji tego wodotrysku, który chcesz użyć.
ciapus4
Ok, a mogę ten wodotrysk umieścić u siebie na serwerze ?
Kshyhoo
Pewnie, ze tak. A tu jet dokumentacja.
ciapus4
Witam, skopiowałem kod css na swój serwer, zmieniłem float: left; na text-align: center; i nadal napis informacja jest po lewo LINK i nie wiem dlaczego znikł mi krzyżyk do zamykania okna, i gdzie jeszcze dopasować obrazek, żeby znikły suwaki. Z góry dziękuję i proszę o wyrozumiałość closedeyes.gif
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.