Tutor.blog

Tutor.Blog je online priručnik na hrvatskom jeziku, za lakše snalaženje u HTML i CSS kodu. Ovdje možete naučiti kako učiniti svoj blog vizualno privlačnim, ali i osnove dizajniranja web stranica koje ne moraju biti nužno vezane uz blog.

Ovaj blog nije povezan sa uredništvom Blog.hr-a, te ne pruža podršku za tehničke probleme.

Besplatni predlošci za blog

Otvaranje pop-up prozora sa određenim svojstvima

Kada kliknete na neki link koji ste postavili, on se otvara u novom prozoru browsera sa svim svojstvima - puna veličina, meniji, scrollbari, status bar... Ako želite nešto od toga maknuti, ili odrediti u kojoj će se veličini prozor otvoriti, ili na kojoj poziciji ce se otvoriti, e za to vam treba JavaScript.
Da napomenem, ljudi moraju imati JavaScript enabled da bi im link radio. Mali postotak ljudi isključuje JavaScript zbog nekih drugih skripti koje obično živciraju posjetitelje.


Najjednostavniji primjer koji ću dati određuje samo širinu i visinu novog prozora, koji na sebi neće imati ništa osim samog sadržaja i naslovne trake:

<a href="#" onClick="window.open('http://www.stranica.com', 'imeprozora', 'width=500,height=400')">KLIKNI ME!</a>

Za target smo postavili # pa postojeći prozor neće napraviti ništa (tj. ostaviti će našu stranicu otvorenu), ali funkcija onClick otvoriti će adresu http://www.stranica.com u prozoru imena imeprozora (ime nije bitno, ali mora pisati nešto) širine 500 i visine 400 pixela. Evo kako to radi:


KLIKNI ME!


Novom prozoru možete odrediti i pojavljivanje dijelova kao scrollbara, statusne trake itd., tako da nakon width=XXX,height=YYY odmah (bez razmaka!) dodate slijedeće vrijednosti, odvojene zarezom:
scrollbars=yes - scrollbar
resizable=yes - resize handle-ovi (promjenu veličine prozora)
location=yes - address bar (ono gdje upisujete URL (adresu) stranice)
menubar=yes - meni (File, Edit, View, Go...)
status=yes - status bar (traka na dnu prozora gdje piše što se događa sa stranicom)
toolbar=yes - ikonice back, forward, refresh, stop, home...
Ako ne želite da se neki od njih prikaže, yes zamijenite sa no.


Ako želite da se prozor otvori na točno određenoj poziciji, trebate dodati još par vrijednosti:
left=XXX - udaljenost od lijevog ruba ekrana (za Internet Explorer)
top=YYY - udaljenost od desnog ruba ekrana (za Internet Explorer)
screenX=XXX - udaljenost od lijevog ruba ekrana (za Netscape Navigator)
screenY=YYY - udaljenost od desnog ruba ekrana (za Netscape Navigator)
Naravno, XXX i YYY zamijenite brojevima. Zašto posebno Netscape i IE? Jer su različiti. Ostali browseri prilagođavaju se jednome od ovoga, ali nije ni bitno kojega jer vi to samo lijepo stavite u kod, a ono što browser ne razumije - ignorirati će :)


Ako ne želite običan link nego one fancy gumbiće, kod izgleda ovako:

<input type="button" value="KLIKNI ME!" onClick="window.open('http://www.stranica.com', 'imeprozora', 'width=500,height=400')" />


Evo, to je bio JavaScript. I ovo je najjednostavnije što može :) Pitanja, kao i uvijek, dobrodošla :)


[EDIT] Evo Ivan je našao super link na generator koda, dakle samo par klikova i imate kod za ono što vam treba :) [/EDIT]

07.03.2005. @ 21:50

Blog je neaktivan i nije ga moguće komentirati. Obrazloženje

Nela Dunato Art & Design

Još niste uspjeli naći baš ono što vam treba? Pretražite cijeli Tutor.Blog:

Google

Informacije, razno

Tekstovi, slike i izvorni kod: nelchee


Nela Dunato art & Design
Moj design portfolio


In obscuro
Besplatni predlošci za web stranice


Cwtam - sketchblog
moj sketchblog




Prati me na Twitteru


Ako želite na svoj blog dodati link do Tutor.blog-a, kopirajte kod iz textbox-a (Desni klik --> Select All --> Copy) na mjesto gdje želite da se link pojavi. Hvala! :D


Tutor.Blog


HTML i CSS tutoriali


HTML i CSS tutoriali

Sadržaj ovog bloga je autorski rad. © 2005-2007 Nela Dunato
Login
Google

Blog.hr koristi kolačiće za pružanje boljeg korisničkog iskustva. Postavke kolačića mogu se kontrolirati i konfigurirati u vašem web pregledniku. Više o kolačićima možete pročitati ovdje. Nastavkom pregleda web stranice Blog.hr slažete se s korištenjem kolačića. Za nastavak pregleda i korištenja web stranice Blog.hr kliknite na gumb "Slažem se".Slažem se