+coduri html pentru ferestre

**dany** Dum Feb 13 2011, 11:33

În prezent noile metode şi tendinţe de creare a site-urilor folosesc mai puţin frame-uri (cadre). Chiar dacă nu le veţi folosi, e bine să cunoaşteţi aceste elemente deoarece le puteţi găsi în alte documente şi să ştiţi despre ce este vorba.
Cadrele (frame-uri) sunt subferestre ale unei ferestre principale, în care sunt incluse.

1. Crearea cadrelor
Fereastra navigatorului poate fi împărţită în mai multe frame-uri (cadre). Un frame este o parte din suprafaţa ferestrei browserului.
Fiecare frame prezintă în interior un document propriu (în general un document HTML). De exemplu puteţi creea două frame-uri într-o fereastră, în primul frame puteţi încărca o pagină de la o adresă (ex. google.com) iar în al doilea frame o altă pagină, de la altă adresă (ex. yahoo.com).
Crearea de frame-uri aparţine limbajului HTML, dar am să descriu câteva lucruri de bază.
Pentru crearea de frame-uri se pot folosi următoarele etichete HTML:

<frameset> , <frame> si <iframe>
Un exemplu de cod HTML care crează o pagină cu două frame-uri este următorul:

Cod:
<html>
<frameset rows="50%,50%">
<frame src="pagina1.html" name="frame1">
<frame src="pagina2.html" name="frame2">
</frameset>
</html>

Proprietatea "row" din eticheta <frameset> aşează cele două frame-uri în linie, unul deasupra celuilalt.
Primul frame, de deasupra, încarcă şi afişează "pagina1.html" iar al doilea frame încarcă şi afişează "pagina2.html".
Dacă vreţi să aşezaţi cele două frame-uri în coloană, unul lângă altul, înlocuiţi cuvântul "row" cu "cols".
Expresia "50%,50%" reprezintă dimensiunea fiecărui cadru, exprimată în procente în raport cu fereastra principală.
Fiecare frame trebuie să aibe un nume unic, exprimat prin atributul "name" din eticheta <frame>, cu ajutorul acestui nume se poate accesa în JavaScript cadrul dorit.
Pentru mai multe detalii desprea crearea de cadre, vedeţi Cadre din cursul HTML.
Pentru crearea unui cadru cu <iframe> puteţi folosi următoarea sintaxă:

<iframe src="url_pagină" width="600" height="200" align="center" scrolling="yes" frameborder="0" name="nume_frame"> </iframe>
Unde "url_pagină" e adresa paginii care va fi încărcată în iframe, "width" şi "height" reprezintă lungimea respectiv înălţimea cadrului (exprimată în procente sau pixeli), "scrolling" reprezintă permisiunea de derulare a paginii din cadru (yes sau no), "frameborder" specifică dacă va fi sau nu afişată o margine (bordură) pentru cadru (1=da, 0=nu), iar "nume_frame" este numele cadrului care va fi folosit de JavaScript.

2. Obiectul Frame
Acest obiect face referire la un cadru (un frame) dintr-o structură de cadre incluse într-o fereastră.
Într-o pagină cu mai multe cadre, obiectul "Window" reprezintă de fapt pagina care conţine tagul <frameset>, iar celelalte pagini sunt considerate cadre în acest context.

Obiectul frame are următoarele proprietăţi:

document - reprezintă documentul curent încărcat în interiorul unui cadru
frames - tablou ce conţine referiri la cadrele copil
length - lungimea tabloului de cadre (numărul de elemente)
name - atributul "name" al etichetei <frame>
parent - fereastra principală sau cadrul principal din care sunt create cadrele copil
self - face referire la cadrul curent
top - fereastra de browser care execută scriptul
window - face referire la fereastra curentă sau la cadrul curent
Obiectul frame are următoarele metode:

blur() - dezactivează cadrul
clearInterval() - anulează o execuţie repetată
clearTimeout() - anulează orice execuţie întârziată
focus() - activează un cadru
print() - apelează caseta de dialog "Print"
setInterval() - stabileşte planificarea funcţiei pentru executare repetată
setTimeout() - stabileşte planificarea funcţiei pentru executare întârziată
3. Frame-uri şi JavaScript
Ierarhia elementelor paginii HTML create în primul exemplu (cele 2 cadre "frame1" şi "frame2" aşezate în linie) este următoarea:

fereastra browser (parinte), care este în vârful ierarhiei, aceasta conţine două cadre copii - "frame1" şi "frame2"
Cu ajutorul numelor date cadrelor putem schimba informaţii între cele două frame-uri împreună cu fereastra principală, de exemplu putem face un link într-un frame care să deschidă o pagină în celălalt frame.
În continuare vom studia trei cazuri de relaţii şi accesări între ferestrele copil şi fereastra părinte.

1. Fereastra părinte accesează o fereastră copil

frame1.document.write("Mesaj de la fereastra părinte");

2. Fereastra copil accesează fereastra părinte

parent.location.href = "http://adresa_url"; (adresa_url este adresa noi paginii care va fi încărcată)
Acest procedeu e util când vreţi să eliminaţi cadrele din fereastra principală. Eliminarea structurii de cadre se face prin încărcarea unei pagini noi în locul paginii principale care a creat frame-ul (aici fereastra părinte). Se poate accesa fereastra părinte din interiorul unei ferestre copil cu ajutorul expresiei "parent". Pentru a încărca un document nou în fereastra părinte se foloseşte "location.href", căruia îi dăm un nou URL, ca în exemplul următor:

3. O fereastră copil accesează o altă fereastră copil

parent.frame2.document.write("Apel de la cadrul frame1");
Nu există legătură directă între cele două cadre, primul frame nu cunoaşte existenţa celuilalt. Pentru fereastra părinte, al doilea cadru (frame) este numit "frame2" iar fereastra principală, văzută din primul frame este numită "parent". Astfel, pentru a avea acces din primul frame la obiectul "document" al celui de-al doilea frame trebuie să scriem următoarele:
4. Navigarea prin cadre
Prin "navigarea prin cadre" se înţelege deschiderea paginilor într-un frame sau în fereastra principală printr-un link din alt frame. Acest lucru se poate face prin mai multe metode.
Pentru a înţelegere mai bine, vom lua un exemplu concret.
Folosim o pagină cu două cadre, în al doilea cadru vom avea legături către mai multe pagini, dar care se vor încărca în primul cadru.

Cod:
<html>
<frameset rows="85%,15%">
<frame src="prima.html" name="frame1">
<frame src="meniu.html" name="frame2">
</frameset>
</html>

Pagina "prima.html" reprezintă pagina iniţială care va fi încărcata în primul frame, cu numele "frame1" (poate fi orice document HTML).
Pentru pagina care va fi încărcata în al doilea frame (meniu.html) vom folosi codul de mai jos pentru crearea ei.

Cod:
<html>
<head>
<script language="JavaScript">

</script>
</head>
<body>
<center>
<a href="javascript:load('test1.htm')">Link1</a> (<i>cu JavaScript</i>) --
<a href="test2.htm" target="frame1">Link2</a> (<i>cu target="frame1"</i>) --
<a href="test2.htm" target="_top">Link3</a> (<i>cu target="_top"</i>)
</center>
</body>
</html></html>

- Se observă diferitele moduri de a încărca o pagină nouă.

- Primul link (Link1) foloseşte funcţia "load()" dintr-un script
- Al doilea link (Link2) foloseşte atributul "target", metoda standard HTML pentru cadre
- Al treilea link (Link3) foloseşte tot atributul "target", de data aceasta prin valoarea "_top" va încărca pagina nouă direct în fereastra principală, eliminând astfel cadrele.
În funcţie de proiectul dv. puteţi decide care variantă e mai potrivită.
Folosind atributul HTML "target" este metoda cea mai simplă.
Soluţia JavaScript este recomandată dacă doriţi să faceţi mai multe lucruri ca o consecinţă a click-ului pe un link, de exemplu când doriţi ca printr-un click să deschideţi două ferestre, în două cadre diferite. Pentru aceasta puteţi utiliza următorul script:

Cod:
<script type="text/javascript">

</script>

- Când va fi apelată funcţia "loadtwo()", va ïncărca "pagina1.html" în "frame1" şi "pagina2.html" în "frame2".
În prezent noile metode şi tendinţe de creare a site-urilor folosesc mai puţin frame-uri (cadre). Chiar dacă nu le veţi folosi, e bine să cunoaşteţi aceste elemente deoarece le puteţi găsi în alte documente şi să ştiţi despre ce este vorba.
Cadrele (frame-uri) sunt subferestre ale unei ferestre principale, în care sunt incluse.
[b][u]1. Crearea cadrelor[/u][/b]

Fereastra navigatorului poate fi împărţită în mai multe frame-uri (cadre). Un frame este o parte din suprafaţa ferestrei browserului.
Fiecare frame prezintă în interior un document propriu (în general un document HTML). De exemplu puteţi creea două frame-uri într-o fereastră, în primul frame puteţi încărca o pagină de la o adresă (ex. google.com) iar în al doilea frame o altă pagină, de la altă adresă (ex. yahoo.com).
Crearea de frame-uri aparţine limbajului HTML, dar am să descriu câteva lucruri de bază.
Pentru crearea de frame-uri se pot folosi următoarele etichete HTML:
[list][b]<frameset> , <frame> si <iframe>[/b]
[/list]
Un exemplu de cod HTML care crează o pagină cu două frame-uri este următorul:

[color=#660066]Cod[/color][color=#666600]:[/color]
[color=#008800]<html>[/color]
[color=#666600]<[/color]frameset rows[color=#666600]=[/color][color=#008800]"50%,50%"[/color][color=#666600]>[/color]
[color=#666600]<[/color]frame src[color=#666600]=[/color][color=#008800]"pagina1.html"[/color] name[color=#666600]=[/color][color=#008800]"frame1"[/color][color=#666600]>[/color]
[color=#666600]<[/color]frame src[color=#666600]=[/color][color=#008800]"pagina2.html"[/color] name[color=#666600]=[/color][color=#008800]"frame2"[/color][color=#666600]>[/color]
[color=#666600]<[/color][color=#008800]/frameset>
</[/color]html[color=#666600]>[/color]

Proprietatea "row" din eticheta <frameset> aşează cele două frame-uri în linie, unul deasupra celuilalt.
Primul frame, de deasupra, încarcă şi afişează "pagina1.html" iar al doilea frame încarcă şi afişează "pagina2.html".
Dacă vreţi să aşezaţi cele două frame-uri în coloană, unul lângă altul, înlocuiţi cuvântul "row" cu "cols".
Expresia "50%,50%" reprezintă dimensiunea fiecărui cadru, exprimată în procente în raport cu fereastra principală.
Fiecare frame trebuie să aibe un nume unic, exprimat prin atributul "name" din eticheta <frame>, cu ajutorul acestui nume se poate accesa în JavaScript cadrul dorit.
Pentru mai multe detalii desprea crearea de cadre, vedeţi [url=http://www.tutorialeonline.net/ro/article/crearea-paginilor-cu-cadre-frame]Cadre[/url] din cursul HTML.
Pentru crearea unui cadru cu <iframe> puteţi folosi următoarea sintaxă:
[list][b]<iframe src="url_pagină" width="600" height="200" align="center" scrolling="yes" frameborder="0" name="nume_frame"> </iframe>[/b]
[/list]
Unde "url_pagină" e adresa paginii care va fi încărcată în iframe, "width" şi "height" reprezintă lungimea respectiv înălţimea cadrului (exprimată în procente sau pixeli), "scrolling" reprezintă permisiunea de derulare a paginii din cadru (yes sau no), "frameborder" specifică dacă va fi sau nu afişată o margine (bordură) pentru cadru (1=da, 0=nu), iar "nume_frame" este numele cadrului care va fi folosit de JavaScript.
[b][u]2. Obiectul Frame[/u][/b]

Acest obiect face referire la un cadru (un frame) dintr-o structură de cadre incluse într-o fereastră.
Într-o pagină cu mai multe cadre, obiectul "Window" reprezintă de fapt pagina care conţine tagul <frameset>, iar celelalte pagini sunt considerate cadre în acest context.

[b]Obiectul frame[/b] are următoarele proprietăţi:
[list][b]document[/b] - reprezintă documentul curent încărcat în interiorul unui cadru
[b]frames[/b] - tablou ce conţine referiri la cadrele copil
[b]length[/b] - lungimea tabloului de cadre (numărul de elemente)
[b]name[/b] - atributul "name" al etichetei <frame>
[b]parent[/b] - fereastra principală sau cadrul principal din care sunt create cadrele copil
[b]self[/b] - face referire la cadrul curent
[b]top[/b] - fereastra de browser care execută scriptul
[b]window[/b] - face referire la fereastra curentă sau la cadrul curent
[/list]
[b]Obiectul frame[/b] are următoarele metode:
[list][b]blur()[/b] - dezactivează cadrul
[b]clearInterval()[/b] - anulează o execuţie repetată
[b]clearTimeout()[/b] - anulează orice execuţie întârziată
[b]focus()[/b] - activează un cadru
[b]print()[/b] - apelează caseta de dialog "Print"
[b]setInterval()[/b] - stabileşte planificarea funcţiei pentru executare repetată
[b]setTimeout()[/b] - stabileşte planificarea funcţiei pentru executare întârziată
[/list]
[b][u]3. Frame-uri şi JavaScript[/u][/b]

Ierarhia elementelor paginii HTML create în primul exemplu (cele 2 cadre "frame1" şi "frame2" aşezate în linie) este următoarea:
[list]fereastra browser ([b]parinte[/b]), care este în vârful ierarhiei, aceasta conţine două cadre [b]copii[/b] - "frame1" şi "frame2"
[/list]
Cu ajutorul numelor date cadrelor putem schimba informaţii între cele două frame-uri împreună cu fereastra principală, de exemplu putem face un link într-un frame care să deschidă o pagină în celălalt frame.
În continuare vom studia trei cazuri de relaţii şi accesări între ferestrele copil şi fereastra părinte.

[b]1. [u]Fereastra părinte accesează o fereastră copil[/u][/b]
[list]
[*]
[list][b][i]frame1[/i].document.write("Mesaj de la fereastra părinte");[/b]
[/list]</LI>
[/list]

[b]2. [u]Fereastra copil accesează fereastra părinte[/u][/b]
[list]
[*]
[list][b]parent.location.href = "http://adresa_url[/b]"; ([i]adresa_url este adresa noi paginii care va fi încărcată[/i])
[/list]Acest procedeu e util când vreţi să eliminaţi cadrele din fereastra principală. Eliminarea structurii de cadre se face prin încărcarea unei pagini noi în locul paginii principale care a creat frame-ul (aici fereastra părinte). Se poate accesa fereastra părinte din interiorul unei ferestre copil cu ajutorul expresiei "[b]parent"[/b]. Pentru a încărca un document nou în fereastra părinte se foloseşte "[b]location.href[/b]", căruia îi dăm un nou URL, ca în exemplul următor: </LI>
[/list]

[b]3. [u]O fereastră copil accesează o altă fereastră copil[/u][/b]
[list]
[*]
[list][b]parent.frame2.document.write("Apel de la cadrul frame1");[/b]
[/list]Nu există legătură directă între cele două cadre, primul frame nu cunoaşte existenţa celuilalt. Pentru fereastra părinte, al doilea cadru (frame) este numit "frame2" iar fereastra principală, văzută din primul frame este numită "parent". Astfel, pentru a avea acces din primul frame la obiectul "document" al celui de-al doilea frame trebuie să scriem următoarele: </LI>
[/list]
[b][u]4. Navigarea prin cadre[/u][/b]

Prin "navigarea prin cadre" se înţelege deschiderea paginilor într-un frame sau în fereastra principală printr-un link din alt frame. Acest lucru se poate face prin mai multe metode.
Pentru a înţelegere mai bine, vom lua un exemplu concret.
Folosim o pagină cu două cadre, în al doilea cadru vom avea legături către mai multe pagini, dar care se vor încărca în primul cadru.[color=#660066]Cod[/color][color=#666600]:[/color]
[color=#008800]<html>[/color]
[color=#666600]<[/color]frameset rows[color=#666600]=[/color][color=#008800]"85%,15%"[/color][color=#666600]>[/color]
[color=#666600]<[/color]frame src[color=#666600]=[/color][color=#008800]"prima.html"[/color] name[color=#666600]=[/color][color=#008800]"frame1"[/color][color=#666600]>[/color]
[color=#666600]<[/color]frame src[color=#666600]=[/color][color=#008800]"meniu.html"[/color] name[color=#666600]=[/color][color=#008800]"frame2"[/color][color=#666600]>[/color]
[color=#666600]<[/color][color=#008800]/frameset>
</[/color]html[color=#666600]>[/color]

Pagina "prima.html" reprezintă pagina iniţială care va fi încărcata în primul frame, cu numele "frame1" (poate fi orice document HTML).
Pentru pagina care va fi încărcata în al doilea frame (meniu.html) vom folosi codul de mai jos pentru crearea ei.

[color=#660066]Cod[/color][color=#666600]:[/color]
[color=#008800]<html>[/color]
[color=#008800]<head>[/color]
[color=#666600]<[/color]script language[color=#666600]=[/color][color=#008800]"JavaScript"[/color][color=#666600]>[/color]
[color=#666600][/color]
[color=#666600]<[/color][color=#008800]/script>
</[/color]head[color=#666600]>[/color]
[color=#008800]<body>[/color]
[color=#008800]<center>[/color]
[color=#666600]<[/color]a href[color=#666600]=[/color][color=#008800]"javascript:load('test1.htm')"[/color][color=#666600]>[/color][color=#660066]Link1[/color][color=#666600]<[/color][color=#008800]/a> (<i>cu JavaScript</[/color]i[color=#666600]>)[/color] [color=#666600]--[/color]
[color=#666600]<[/color]a href[color=#666600]=[/color][color=#008800]"test2.htm"[/color] target[color=#666600]=[/color][color=#008800]"frame1"[/color][color=#666600]>[/color][color=#660066]Link2[/color][color=#666600]<[/color][color=#008800]/a> (<i>cu target="frame1"</[/color]i[color=#666600]>)[/color] [color=#666600]--[/color]
[color=#666600]<[/color]a href[color=#666600]=[/color][color=#008800]"test2.htm"[/color] target[color=#666600]=[/color][color=#008800]"_top"[/color][color=#666600]>[/color][color=#660066]Link3[/color][color=#666600]<[/color][color=#008800]/a> (<i>cu target="_top"</[/color]i[color=#666600]>)[/color]
[color=#666600]<[/color][color=#008800]/center>
</[/color]body[color=#666600]>[/color]
[color=#666600]<[/color][color=#008800]/html></[/color]html[color=#666600]>[/color]

- Se observă diferitele moduri de a încărca o pagină nouă.
[list]- Primul link (Link1) foloseşte funcţia "load()" dintr-un script
- Al doilea link (Link2) foloseşte atributul "target", metoda standard HTML pentru cadre
- Al treilea link (Link3) foloseşte tot atributul "target", de data aceasta prin valoarea "_top" va încărca pagina nouă direct în fereastra principală, eliminând astfel cadrele.
[/list]
În funcţie de proiectul dv. puteţi decide care variantă e mai potrivită.
Folosind atributul HTML "target" este metoda cea mai simplă.
Soluţia JavaScript este recomandată dacă doriţi să faceţi mai multe lucruri ca o consecinţă a click-ului pe un link, de exemplu când doriţi ca printr-un click să deschideţi două ferestre, în două cadre diferite. Pentru aceasta puteţi utiliza următorul script:

[color=#660066]Cod[/color][color=#666600]:[/color]
[color=#666600]<[/color]script type[color=#666600]=[/color][color=#008800]"text/javascript"[/color][color=#666600]>[/color]
[color=#666600] [/color]
[color=#666600]</[/color]script[color=#666600]>[/color]

- Când va fi apelată funcţia "loadtwo()", va ïncărca "[i]pagina1.html[/i]" în "frame1" şi "[i]pagina2.html[/i]" în "frame2".

**Kreskova** Dum Feb 13 2011, 11:36

Nu ma pricep nu ma bag dar banuiesc ca e o treaba buna Exclamation

	Recomandare • Citeste regulament-ul • Daca ai probleme la inregistrare anunta problemele forumului • Urmeaza tutorialele pentru incepatori ! Regulament \| Probleme \| Tutoriale		Bine Ai Venit ! • Te rugam sa te inregistrezi ! • Inregistrarea este complet gratuita • Nu dureaza mult • Si se aciveaza pe loc Iregistrare
	Comunitatea Asasini		ro-mn.4rumer.com

	Recomandare • Citeste regulament-ul • Daca ai probleme la inregistrare anunta problemele forumului • Urmeaza tutorialele pentru incepatori ! Regulament \| Probleme \| Tutoriale		Bine Ai Venit ! • Te rugam sa te inregistrezi ! • Inregistrarea este complet gratuita • Nu dureaza mult • Si se aciveaza pe loc Iregistrare
	Comunitatea Asasini		ro-mn.4rumer.com

+coduri html pentru ferestre

+coduri html pentru ferestre

Re: +coduri html pentru ferestre

Counter strike 1.6