Div 1 div 2 div 3

Status
Niet open voor verdere reacties.

jeroensdesign

Gebruiker
Lid geworden
20 sep 2011
Berichten
56
Chooce.jpg

Hier vind u een afbeelding met het idee

als er op de eerst vlag geklikt wordt verschijnt er in DIV 1 recepten die geopent worden in DIV 2 ( is de bedoeling)
En als er op de tweede vlag geklikt word wordt er weer in DIV 1 thaise recepten geopent die in DIV 2 getoont worden als erop geklikt wordt

Hoe krijg ik dat voor elkaar

Graag advies
 
Het probleem met dit soort vragen is
dat er voor de oplossing kennis nodig is.

Er zijn meerdere oplossingen
  • met gebruik van frames; maar dat is niet meer van deze tijd (en met goede redenen)
  • zelfbouw met gebruik van PHP/databases
  • zelfbouw met gebruik van AJAX
  • bouwen met behulp van een CMS

Ik zie een goede oplossing voor me met behulp van Wordpress
maar dan moet je daar wel mee kunnen werken.
 
Beste

HTML:
<!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=utf-8" />
<title>Untitled Document</title>

<link href="../CSS/css.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#apDiv1 {
	position:absolute;
	left:8px;
	top:130px;
	width:132px;
	height:621px;
	z-index:6;
}
#apDiv6 {
	position:absolute;
	left:142px;
	top:230px;
	width:735px;
	height:521px;
	z-index:7;
}
</style>
</head>

<body>
<div id="apDiv1"><b><center>Menu</center></b></div>
<div id="apDiv2"></div>
<div id="apDiv5"><img src="../Pictures/eu.png" align="right" width="100" height="71" alt="Europian menu" /></div>
<div id="apDiv4"></div>
<div id="apDiv5"><img src="../Pictures/Thailand.jpg" width="100" height="71" alt="Thai Menu" /><b><center>Select your menu</center></b></div>

<div id="apDiv6"></div>
<blockquote>
  <p><img src="../Schetsen/JPG/Family Restaurant Menu.jpg" width="1002" height="113" alt="Family Restaunt Menu" />
  </p>
</blockquote>
</body>
</html>

zoiets het ik in gedachten

ik weet dat er met een paar simpele php regeltjes een oplossing voor is maar deze website waar ik die ooit gevonden heb weet ik niet meer

mijn middelste ap div is nu 6 dus daar moet alles in geopend worden
 
Hoi jeroen,
Behalve de oplossingen van tecsman zou je het ook gewoon recht-toe-recht-aan kunnen doen:
  • Elk recept in div-2 is een eigen pagina.
  • Het menu in div-1 is steeds hetzelfde (EU of TH).
  • Alle andere pagina-onderdelen zijn ook hetzelfde, behalve <title>, omschrijving & trefwoorden.
  • Alle onderdelen die hetzelfde blijven, zet je er in met php-includes.


recepten-menu.png

Als voordelen zie ik:


  • Komt er een nieuw recept bij, dan hoef je dat alleen maar één keer op het bijbehorende div-1 fragment toe te voegen. Na uploaden wordt dat dan meteen op alle pagina's doorgevoerd.
  • Geen moeite nodig om een één-pagina-systeem te bedenken; met copy/paste is een nieuwe pagina binnen een tel aangemaakt.
  • Voor de bezoeker maakt een pagina-wissel niets uit (alle pagina-onderdelen behalve het nieuwe recept zijn al gedownload); ook de pagina-snelheid zal er niet onder te lijden hebben.
  • Het is niet AJAX cq. javascript-afhankelijk: werkt altijd, ook als javascript uit staat.
  • Is toegankelijk.
  • Rechtstreeks doorlinken naar een recept-pagina mogelijk (o.a. goed voor de PR; men kan bv. in een mailtje zetten "Kijk hier eens in dit recept").
  • Geeft betere zoekmachine-mogelijkheden.

Een recept-pagina hoeft zo niet meer te bevatten dan iets als:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="nl" xml:lang="nl">
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<title>...., Thais recept voor ...</title>
	<meta name="description" content="Het Thais recept voor ... is bij uitstek geschikt om ..." />
	<meta name="keywords" content="..., ..., ..., ..." />
<?php include("voor-inhoud-EU.htm"); ?>

<div id="div2">
	<h1>...., Thais recept voor ...</h1>
	<p>Men neme ...</p>
	... enz.
	<h2>Ingrediëntenlijst</h2>
	<ul>
		<li>...</li>
		<li>...</li>
		<li>...</li>
	</ul>
</div>

<?php include("na-inhoud-EU.htm"); ?>
Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan