JavaScript - okna
| DZIAŁANIE: |
Otwórz inną stronę w okienku! Zamknij okienko! Okno nawigacyjne |
Kod:
Kod pliku przykładu :
Kod plików wyświetlanych w okienku :
![]()
Ewentualne Objaśnienia:
Teraz zajmiemy się okienkami w JS. Mogą się one przydać w przeróżnych
sytuacjach, w końcu nie każdy lubi jak coś mu się otwiera w nowym oknie czy
zakładce, a niektóre rzeczy jak na przykład wyniki sondy najlepiej otwierać w
takich nowych małych okienkach.
No i popatrzmy na nasz przykład - w pliku tego przykładu otwieramy nowie okienko
przez instrukcję window.open - jej 1 parametr to strona, plik jaki ma się
otworzyć w tym naszym nowym okienku. Drugi parametr to pewna etykieta, nazwa -
dzięki niej dla przykładowego łącza ustalamy parametr TARGET - właśnie tą nazwę
i dzięki temu plik 15przyklad2.html otwiera się w tym okienku. 3 parametr to
miejsce gdzie ustalamy jak nasze okienko ma wyglądać - w tym przykładzie
ustaliłem tylko szerokość i wysokość. Jednak tych właściwości jest więcej tzn. :
- directories - dodaje specjalne przyciski (jedynie Netscape)
- height - wiadomo
- width
- left - umieszcza lewą krawędzi okienka o x pikseli od lewej krawędzi ekranu
- top - jak wyżej tylko od górnej krawędzi
- location - pasek adresu (dla Firefox należy podać jeszcze toolbar)
- menubar - pasek narzędzi
- resizable - możliwość zmian rozmiarów okna
- scroolbars - paski przewijania
- status - paski statusu (stanu)
- toolbar - wyświetlenie standardowego dla danej przeglądarki paska narzędzi
Jeśli chcielibyśmy aby jakiś element nie był wyświetlany możemy albo go nie podawać tak jak w przykładzie, albo wpisać na przykład : toolbar=no. Wyświetlanie okienek w różnych przeglądarkach może nieraz się różnić trzeba sobie z tego zdawać sprawę.
No i teraz kwestia zamknięcia takiego okienka - jest to bardzo proste jeśli mamy łącze w kodzie danego okna, okienka to zamykamy go po prostu windows.close() jednak jeśli chcemy w danym oknie umieścić łącze do zamknięcia innego to musimy wskazać jakie to okna - czyli jak w przykładzie : nazwaokna.close() (tutaj nowe.close) .
Zwróć również uwagę na łącza tutaj nie pisałem już zdarzeń onClick tylko we właściwości HREF elementu A wywoływaliśmy odpowiedni kod JS.
No i nasz kolejny link - wywołuje on okienko (tutaj juz onClick, ale można była tak jak wyżej), które sobie nazywamy nawigacyjne - zwróć uwagę na wpis nawigacyjne.focus() - to kolejna metoda związana z obiektem window - powoduje ona, że otwierane okienko jest umieszczona nad innym okienkami. Inna metoda to metoda blur - umieszcza pod innym oknami.