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

Jquery bug in systeem

Door ruben op 13-01-2009 23:31
279 views
Ik heb een HTML pagina gemaakt met een reeks foto's naast elkaar.
Onder de foto's is er een mogelijkheid op een zwart vierkantje te klikken zodat er informatie naar beneden schuift. Deze beweging is mogelijk met jquery. Alles werkt zoals het hoort .. behalve dit:

Als je onder foto 4 op het vierkantje wilt klikken, zodat de informatie naar beneden schuift, spring je telkens naar het begin van de pagina. Dit gebeurt bij elke foto. Je kan het weliswaar alleen zien bij foto 3 & 4 aangezien foto 1 & 2 al aan het begin van de pagina staan.

Ik heb desbetreffende pagina op internet gesmeten. Deze kan gedownload worden zodat het probleem duidelijker wordt.

http://www.mediafire.com/?sharekey=241ea5b74fec288891b20cc0d07ba4d220d4356cd7edc486

Wat doe ik om dit te voorkomen?

Alvast bedankt,
Ruben
r
ruben
13-01-2009 23:37
Probleem opgelost!
j
jojo
13-01-2009 23:44 

<!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' xml:lang='en' lang='en'>
<head>
    <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
    <title>RUBEN</title>
    <link rel='stylesheet' href='css/style.css' type='text/css' />
    		    <script src="http://code.jquery.com/jquery-latest.js"></script>
				<script>
                $(function(){
									$(".link_op_beeld").click(function () {
										$(this).parent().find('p.p').toggle("slow");
										return false;
									});        
                });
                </script>
</head>

<body id='body'>
<div id='menu'>
<div class='container'>
<br /><br />

<p class="dit_is_die_p-tag">RUBEN PERSOONS<br>
— WORKS</p>


<ul>
<li class='section-title'><b>MENU</b></li>
<li><a href='index.html'>HOME</a></li>
<li><a href='page2.html'>FOTO KLEUR</a></li>
<li><a href='page3.html'>FOTO ZWART WIT</a></li>
<li><a href='page4.html'>ONTWERP</a></li>
<br />
<li><a href='page5.html'>INFO</a></li>
<li><a href='page6.html'>BLOG</a></li>

</ul>
</FONT>
</div>	
</div>	

<div id='content'>
<div class='container'>

<!-- text and image -->
<br /><br />
<div id='scroll-container'>

		<div class="beeldcontainer">
   		<img src='images/small/kleur01.jpg'> 
        <br />
        <a href="#" class="link_op_beeld"><img src="zwartbolleke.jpg" /></a>
        <p style="display: none" class="p">Black Heart Rebellion Tour '07, Netherlands.</p>
      	</div>
        
    	<div class="beeldcontainer">
		<img src='images/small/kleur02.jpg'>
        <br />
		<a href="#" class="link_op_beeld"><img src="zwartbolleke.jpg" /></a>
        <p style="display: none" class="p">Black Heart Rebellion Tour '07, Austria.</p>
		</div>
        
        <div class="beeldcontainer">
   		<img src='images/small/kleur03.jpg'>
        <br />
        <a href="#" class="link_op_beeld"><img src="zwartbolleke.jpg" /></a>
        <p style="display: none" class="p">Black Heart Rebellion Tour '07, Austria.</p>
      	</div>
        
    	<div class="beeldcontainer">
		<img src='images/small/kleur04.jpg'>
        <br />
        <a href="#" class="link_op_beeld"><img src="zwartbolleke.jpg" /></a>
        <p style="display: none" class="p">Black Heart Rebellion Tour '08, Germany.</p>
		</div>
        	   
</div>

<!-- end text and image -->

</div>
</div>
</body>
</html>


Ik heb er return false; bij gezet en nu werkt het wel.
Waarom kan ik niet uitleggen.

Heb ook je code wat flexibler gemaakt :P dit was een oplossing van niks sorry.

Veel succes met je website :-)

Reageren

Inloggen om te reageren