PHPhulp.nl PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
p

jquery

Door peter paul op 24-11-2008 15:47
1.781 views
Ik las dat ik de vraag hier moest stellen en dat voor mijn robleem ik het beste met jquey kon werken.

Ik heb zelf nog nooit met deze taal gewerkt dus weet er weinig tot niets van af.

Ik heb het volgende waar ik tegen aan loop.
Drie knoppen langs elkaar. Daar onder een plaats waar wat content kan.

Ik begin met 3 knoppen zonder content. Als ik op 1 van de knoppen klik moet er content komen van de betreffende knop, klik ik op een andere knop dan komt er die content te staan. Klik ik nogmaals op de zelfde knop dan zou ik graag willen dat de content weer volledig verdwijnt.

Ik heb echt alles afgezocht maar niet gevonden waar ik naar opzoek ben. kan iemand mij aan een stukje code helpen waar ik mee verder kan.
p
peter paul
24-11-2008 20:04
dankje ik ga zeker nog gebruiken maken van die site. er stonden een aantal mooie dingen op.

Maar ik ben niet tegen gekomen waar ik naar opzoek was.
hier is een voorbeeld van wat ik zoek. let niet op de inhoud zelf ik heb zo maar wat in getypt.

http://www.youtube.com/watch?v=IXlFSAIi3vc

wanneer je iets naar beneden scrolled onder de video zelf zie je. Delen, favoriet, afspeellijst enz. als je der op klikt komt er wat nieuwe content bij en wanneer je op een andere klikt wordt de content vervangen voor de des betreffende knop.

het enige verschil is dat ik ook graag zou willen dat wanneer je met een bepaalde knop de content opent dat je hem ook me de zelfde knop weer kan sluiten.

Kan iemand mij ook aan zo'n script helpen??
p
peter paul
26-11-2008 15:53
Ik schop hem maar weer eens omhoog.
J
Jacco Engel
26-11-2008 16:10
Niet gewoon 


<!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>Untitled Document</title>
</head>
<script type="text/javascript">
function setContent(bron,doel)
{

	document.getElementById(doel).innerHTML = document.getElementById(bron).value ;
}

function clearContent(doel)
{
	document.getElementById(doel).innerHTML = "" ;
}

</script>
<body>
<textarea id="input_content"></textarea>
<input type="button" value="Set content" onclick="setContent('input_content','content')" />
<input type="button" value="Clear content" onclick="clearContent('content')" />

<div id="content">
</div>
</body>
</html>


Of denk ik nu te makkelijk?
p
peter paul
28-11-2008 16:18
@jacco: Nee, dat is niet echt wat ik bedoel, uiteraard wel bedankt voor je tijd.

Ik zal het nog wat duidelijker proberen uit te leggen.
Als ik naar de pagina ga zie je alleen 3 buttons langs elkaar. Wanneer je op een van de buttons klikt dan komt er onder deze buttons een content gedeelte. De knoppen zijn dus bedoeld om de content te laten zien of juist niet. Maar de knoppen moet en ook zo werken, dat wanneer er al content van button 1 is te zien en je klikt op twee dat dan de content van 1 weg gaat en de content van button 2 er komt te staan.

Hier zie je eigenlijk precies wat ik bedoel.
http://www.youtube.com/watch?v=IXlFSAIi3vc

Wanneer je iets naar beneden scrolled onder de video zelf zie je. Delen, favoriet, afspeellijst enz. als je der op klikt, komt er wat nieuwe content bij en wanneer je op een andere klikt, wordt de content vervangen voor de des betreffende knop.
T
Tamara
28-11-2008 16:25
linkje

je kan ook even google op de naam die op youtube staat ;)

heb hem binnen 2 minuten gevonden.
p
peter paul
29-11-2008 15:31
bedankt voor een reactie maar ik heb eens naar je link gekeken en het is totaal iets anders dan waar ik naar opezoek ben.

Btw je zegt: Je googled even naar de naam. Maar waar haal je die naam vandaan dan??
N
Niek Weevers
29-11-2008 17:11
Je wilt in principe met tabs werken.
Dit kan ideaal met jquery. Wat youtube doet is in combinatie met ajax, maar dit hoeft niet. In principe zet je al je content van de verschillende tabjes al in de broncode, je regelt dan alleen nog met jquery welke je laat zien of verbergt.

Kijk hier maar ff. Je kan zelf dan nog erbij scripten dat je standaard niks laat zien.
(Dit is de oudere versie)

Je vroeg ook nog wat jqeury is. Het is simpel gezegd een javascript library (dus het is geen taal). Ik vind hem ideaal, het is een goede library waar je met relatief weinig en makkelijke code leuke dingen uithaalt.
p
peter paul
05-12-2008 15:01
Ik heb naar de pagina gekeken die je me linkte maar ik wordt er niet wijzer uit. Ik ben vervolgens maar weer eens verder gaan googlen en heb toen met wat hulp van sites dit gemaakt 


<html>
<head>

<script language="javascript"> 
function toggle(showHideDiv, switchTextDiv) {
	var ele = document.getElementById(showHideDiv);
	var text = document.getElementById(switchTextDiv);
	if(ele.style.display == "block") {
    		ele.style.display = "none";
		text.innerHTML = "open";
  	}	else {
		ele.style.display = "block";
		text.innerHTML = "close";
	}
} 


</script>
</head>

<body>
<a id="myFilter" href="javascript:toggle('Filter','myFilter');" >open</a>

						<div id="Filter" style="display: none;">
							content</div>

</body>
</html>\


Dit is een beetje wat ik bedoel makkelijk maar het werkt goed. Nou zou ik graag alleen 3 van deze links naast elkaar willen. en als de een geopend is dat die sluit wanneer er op een andere link geklikt wordt.

Reageren

Inloggen om te reageren