Archief - "Verkoop gallerij"

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
X

XYRIS

Legacy Member
Hallo,

IK weet niet of ik hier juist zit maar ik heb een heleboel spullen die
ik te koop heb. Nu heb ik een webspace van Telenet.

Graag had ik een soort van "tabel" bv 6 breed en zo diep ik objecten heb.

6 vierkante kadertjes grote naargelang hoeveel 4 - 5 - 6 foto's op een breedte
kunnen met daarin dus de foto.
Daaronder dan precies een tekstvlak met korte info en de richtprijs

De vraag is dan ook hoe ik dit makkelijk kan aanpassen als er iets bij moet
of verwijderd moet worden.

Ik werk met WSFTP voor vanalles op webspace te zetten.
A

Arvin

Legacy Member
Code: 
<!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>Verkoop gallerij</title>
<style type="text/css">
#container {position:relative; margin:auto; width:600px;}
.itemwrap {float:left; width:100%;}
.itemwrap img {float:left; width:100px; height:auto;}
.itemwrap p {float:left; width:100%;}
</style>
</head>
<body>
<div id="container">
	<div class="itemwrap">
		<img src="Abeelding1_1.jpg" alt="afbeelding1_1" />
		<img src="Abeelding1_2.jpg" alt="afbeelding1_2" />
		<img src="Abeelding1_3.jpg" alt="afbeelding1_3" />
		<img src="Abeelding1_4.jpg" alt="afbeelding1_4" />
		<img src="Abeelding1_5.jpg" alt="afbeelding1_5" />
		<img src="Abeelding1_6.jpg" alt="afbeelding1_6" />
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vel lacinia turpis. Nunc eu pharetra ipsum. Fusce vitae metus mauris, at placerat mi. Suspendisse eget libero tortor, ultricies iaculis odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla porttitor mollis bibendum. Donec varius eros ut nibh commodo venenatis. Proin sit amet facilisis sem. Sed at nisi pulvinar neque fringilla tincidunt tempor eu dolor.</p>
	</div>
	<div class="itemwrap">
		<img src="Abeelding2_1.jpg" alt="afbeelding2_1" />
		<img src="Abeelding2_2.jpg" alt="afbeelding2_2" />
		<img src="Abeelding2_3.jpg" alt="afbeelding2_3" />
		<img src="Abeelding2_4.jpg" alt="afbeelding2_4" />
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vel lacinia turpis. Nunc eu pharetra ipsum. Fusce vitae metus mauris, at placerat mi. Suspendisse eget libero tortor, ultricies iaculis odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla porttitor mollis bibendum. Donec varius eros ut nibh commodo venenatis. Proin sit amet facilisis sem. Sed at nisi pulvinar neque fringilla tincidunt tempor eu dolor.</p>
	</div>
</div>
</div>
</body>
</html>


Zoiets, maar dan beter uitgewerkt?
D

Dieterg

Legacy Member
Wat je kan doen is werken met XML. Je zal 1x uw site moeten stijlen en dan kan je achteraf via XML elementen toevoegen/verwijderen..

Wat je doet is je maakt een div aan op uw pagina die leeg is. In deze div kan je via jQuery en XML 'objecten' invoegen. Een XML file ziet er als volgt uit (sla dit bv op als gallerij.xml):
Code: 
<?xml version="1.0" encoding="iso-8859-1"?>
 <gallerijen>
   <gallerij>
     <title>XML Test</title>
	 <afbeelding>https://www.beyondgaming.be/forums</afbeelding>
     <omschrijving>Dit is een omschrijving</omschrijving>
   </gallerij>
   <gallerij>
     <title>XML Test</title>
	 <afbeelding>https://www.beyondgaming.be/forums</afbeelding>
     <omschrijving>Dit is een omschrijving</omschrijving>
   </gallerij>
   <gallerij>
     <title>XML Test</title>
	 <afbeelding>https://www.beyondgaming.be/forums</afbeelding>
     <omschrijving>Dit is een omschrijving</omschrijving>
   </gallerij>
   <gallerij>
     <title>XML Test</title>
	 <afbeelding>https://www.beyondgaming.be/forums</afbeelding>
     <omschrijving>Dit is een omschrijving</omschrijving>
   </gallerij>
   <gallerij>
     <title>XML Test</title>
	 <afbeelding>https://www.beyondgaming.be/forums</afbeelding>
     <omschrijving>Dit is een omschrijving</omschrijving>
   </gallerij>
</gallerijen>

Zoals je kan zien is het niet moeilijk om hier gallerijen aan toe te voegen of verwijderen.

Dit XML file kan je dan als volgt ophalen (gallerij.xml dezelfde map als index.html) en in dit geval deze code in de head van uw index.html file:
PHP: 
$(document).ready(function() {
				$.ajax({
					type : "GET",
					url : "gallerij.xml",
					dataType : "XML",
					success: function(xml) {
						$(xml).find('gallerij').each(function() {
							site = $(this);
							
							var title = site.find('title').text();
							var afbeelding = site.find('afbeelding').text();
							var omschrijving = site.find('omschrijving').text();
							
							$('#wrapper').append('<div class="gallerij"><h2>' + title + '</h2><img src="' + afbeelding +'" alt=""/><p>' + omschrijving + '</p></div>');
						});
					}
				});
			});
-

-BVR-

Legacy Member
Dan kan je hier beter een jobaanbieding zetten, denk ik zo. Om alles over HTML uit te leggen (om dan nog te zwijgen van jQuery) zijn we lang bezig! Dan laat je het beter door iemand anders doen.

Om Mam nog even bij te staan: jQuery zelf niet vergeten te includen in je index.html! ;)
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan