Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
teava rezistenta panou apa calda

Acces in Curte din Drum National

Sub mobila de bucatarie si sub fr...

Rezultat RMN
 Numar circuite IPAT si prindere t...

Pareri brgimportchina.ro - teapa ...

Lucruri inaintea vremurilor lor

Discuții despre TVR Sport HD
 Cost abonament clinica privata

Tremura toata, dar nu de la ro...

Renault Android

Recomandare bicicleta e-bike 20&#...
 Bing-Content removal tool

Nu pot accesa monitorulsv.ro de l...

Cum sa elimini urmele de acnee?

Wc Geberit
 

Problemă poziționare div și iframe height

- - - - -
  • Please log in to reply
21 replies to this topic

#19
poadol

poadol

    Guru Member

  • Grup: Senior Members
  • Posts: 14,104
  • Înscris: 13.12.2010
Cam asa presupun dar altfel de imagini, sau gresesc?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Home</title>
<style>
#baza {
margin-top:40px;
margin-left:40px;
width:770px;
height:76;

}
.baza1 {
display:inline;
width:102;
height:172;
}
#baza2 {
margin-left:40px;
}
.baza4 {
width: 60px;
color: black; 
font-family: Courier;
}
#bor1 {
position: absolute; 
margin-top: -45px; 
margin-left: 50px; 
}
#bor2 {
position: absolute; 
margin-top: -45px; 
margin-left: 200px; 
}
#bor3 {
position: absolute; 
margin-top: -45px; 
margin-left: 350px; 
}
#bor4 {
position: absolute; 
margin-top: -65px; 
margin-left: 495px; 
}
#bor5 {
position: absolute; 
margin-top: -45px; 
margin-left: 640px; 
}
.baza4:hover {
text-decoration:underline;
}
</style>
</head>
<body height="100%" >
<div id="baza">
<div >
<img src="home1.jpg" alt="Home" title="Home" >
<a href="Home.htm" target="atare"><div id="bor1" ><strong>Home</strong></div></a>
</div>
<div >
<img src="carte.jpg" alt="Carte" title="Carte" >
<a href="diva2.htm" target="atare"><div id="bor2" ><strong>Carte</strong></div></a> 
</div>
<div >
<img src="project.jpg" alt="Proiect" title="Proiect" >
<href="#" target="atare"><div id="bor3" ><strong>Proiect</strong></div></a>
</div>
<div >
<img src="lucrare.jpg" alt="Lucrare si Publicatie" title="Lucrare si Publicatie" >
<href="#" target="atare"><div id="bor4" ><strong>Lucrare si Publicatie</strong></div></a> 
</div>
<div >
<img src="vizualizeaza.jpg" alt="Vizualizeaza" title="Vizualizeaza" >
<href="#" target="atare"><div id="bor5" ><strong>Vizualizeaza</strong></div></a> 
</div>
</div>
<div id="baza2">
<iframe frameborder="1" src="Home.htm" name="atare" ></iframe>
</div>
</body>
</html>

diva2.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IFrame lateral stanga</title>
<style>
#korn {
display:block;
width:132;
height:304;
}
.korn {
width: 80px;
color: black; 
font-family: Courier;
}
#korn1, #korn2, #korn3 {
position: absolute; 
margin-top: -44px; 
margin-left: 27px; 
}
#korn4 {
position: absolute; 
margin-top: -44px; 
margin-left: 10px; 
}
.korn:hover {
text-decoration:underline;
}
</style>
</head>
<body>
<div id="korn">
<div><img src="adauga.jpg" alt="Adauga" title="Adauga" ><a href="adauga.htm" target="_top"><div id="korn1"><strong>Adauga</strong></div></a></div>
<div><img src="sterge.jpg" alt="Sterge" title="Sterge" ><a href="sterge.htm" target="_top"><div id="korn2"><strong>Sterge</strong></div></a></div>
<div><img src="modifica.jpg" alt="Modifica" title="Modifica" ><a href="modifica.htm" target="_top"><div id="korn3"><strong>Modifica</strong></div></a></div>
<div><img src="vizualizare.jpg" alt="Vizualizare" title="Vizualizare" ><a href="vizualizare.htm" target="_top"><div id="korn4"><strong>Vizualizare</strong></div></a></div>
</div>
</body>
</html>

Home.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" height="100%">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IFrame lateral stanga</title>
<style>
#korn {
display:block;
width:82;
height:264;
}
</style>
</head>
<body>
<div id="korn">
<div><img src="vizualizare.jpg" alt="Vizualizare" ></div>
<div><img src="adauga.jpg" alt="Adauga" ></div>
<div><img src="sterge.jpg" alt="Sterge" ></div>
<div><img src="modifica.jpg" alt="Modifica" ></div>
</div>
</body>
</html>

adauga.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Adauga</title>
<style>
h1 {
text-align:center;
}
</style>
</head>
<body>
<h1>Adauga</h1>
</body>
</html>
sterge.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Sterge</title>
<style>
h1 {
text-align:center;
}
</style>
</head>
<body>
<h1>Sterge</h1>
</body>
</html>
modifica.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Modifica</title>
<style>
h1 {
text-align:center;
}
</style>
</head>
<body>
<h1>Modifica</h1>
</body>
</html>
vizualizare.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Vizualizare</title>
<style>
h1 {
text-align:center;
}
</style>
</head>
<body>
<h1>Vizualizare</h1>
</body>
</html>

Cam astea ar fi:

Attached Files



#20
DanaS13

DanaS13

    Junior Member

  • Grup: Members
  • Posts: 24
  • Înscris: 23.03.2013
Da, exact ca în imaginea atașată! Dar de ce ar trebui să fac pagină html pt fiecare obiect din meniu?

#21
poadol

poadol

    Guru Member

  • Grup: Senior Members
  • Posts: 14,104
  • Înscris: 13.12.2010

View PostDanaS13, on 04 aprilie 2013 - 11:12, said:

1. Da, exact ca în imaginea atașată!
2. Dar de ce ar trebui să fac pagină html pt fiecare obiect din meniu?
1. Ai incercat sa vezi daca se comporta asa cum ti-ai imaginat?
2. Trebuie sa-i "spui" browser-ului ce si cum sa iti afiseze pe monitorul calculatorului sau laptop-ului, (trebuie sa-i "spui" serverului in ce fel doresti sa fie stocata informatia), pentru ca mai apoi sa poti interactiona cu acele date. Cum preferi sa faci lucrul descris mai sus?
Sunt diferite metode prin care le poti reduce numarul sau poti utiliza PHP si Javascript sa le creeze, afiseze in browser + XML si SQL pentru stocarea organizata pe server + daca este necesar AJAX, JSON pentru schimb de date cu serverul fara a reincarca pagina in browser, ori utilizezi CMS-uri - CMS = sistem de management al conținutului - cum ar fi Wordpress sau Joomla care evident se bazeaza pe limbajele de programare enumerate mai sus. Fiecare are plusuri si minusuri daca se pot numi asa, dar oricare metoda ai dori sa utilizezi este necesar mai intai sa inveti cum, sau sa stii cat mai precis ceea ce doresti si sa platesti pe cineva care se pricepe sa iti transpuna in realitate dorintele.

#22
poadol

poadol

    Guru Member

  • Grup: Senior Members
  • Posts: 14,104
  • Înscris: 13.12.2010
1. Dupa pagina initiala numai pentru Home am facut un fisier Home.htm fara link-uri si pentru Carte un fisier diva2.htm cu link-uri catre cele 4 fisiere:
- adauga.htm,  
- sterge.htm,  
- modifica.htm,  
- vizualizare.htm,
in rest nimic, doar ca sa vezi cum se inlantuie si daca se comporta asa cum ai descris  ("Da eu vrea să se redimensioneze în funcție de browser, să ocupe tot spațiul rămas liber. Fără javascript nu se poate?") pentru al doilea iframe fara a folosi un iframe sau Javascript, dupa care le faci sau le organizezi cum doresti.

In IE6 de exemplu nu functioneaza corect sunt necesare unele ajustari Posted Image, l-am incercat doar in Firefox19 unde functioneaza corect. Posted Image

Anunturi

Chirurgia spinală minim invazivă Chirurgia spinală minim invazivă

Chirurgia spinală minim invazivă oferă pacienților oportunitatea unui tratament eficient, permițându-le o recuperare ultra rapidă și nu în ultimul rând minimizând leziunile induse chirurgical.

Echipa noastră utilizează un spectru larg de tehnici minim invazive, din care enumerăm câteva: endoscopia cu variantele ei (transnazală, transtoracică, transmusculară, etc), microscopul operator, abordurile trans tubulare și nu în ultimul rând infiltrațiile la toate nivelurile coloanei vertebrale.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate