Thread: slideshow inside slider
-
26-05-2012, 23:36 #1
slideshow inside slider
Hallo,
ik probeer een jquery cycle slideshow in een horizontale Slider te steken, maar dit werkt niet. Moet ik het script ergens anders zetten? Afhankelijk van waar ik welk script zet werkt er één van de slideshows of helemaal niets.
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="screen.css" />
<script type="text/javascript" src="js/jquery-1.3.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myslides').cycle({
fx: 'fade',
speed: 5000,
timeout: 2000
});
});
</script>
</head>
<body>
<div id="header">
<hr>
</div>
<div id="menu">
<a href="#" onClick="Animate2id('#c1'); return false">home</a>
<a href="#" onClick="Animate2id('#c2','easeOutQuint'); return false" >creaties</a>
<a href="#" onClick="Animate2id('#c3','easeOutQuint'); return false" >boeket v/d week</a>
<a href="#" onClick="Animate2id('#c4','easeOutQuint'); return false" >bestellingen</a>
<a href="#" onClick="Animate2id('#c5','easeOutQuint'); return false" >contact</a>
</div>
<div id="container">
<div id="c1">
<div class="content">
<div id="myslides">
<img src="images/capitol.jpg" />
<img src="images/flowers.jpg" />
<img src="images/countryscene.jpg" />
</div>
</div>
</div>
<div id="c2">
<div class="content">Content 2</div>
</div>
<div id="c3">
<div class="content">Content 3</div>
</div>
<div id="c4">
<div class="content">Content 4</div>
</div>
<div id="c5">
<div class="content">
<p>
</p>
</div>
</div>
</div>
<div id="footer">
</div>
<script>
function Animate2id(id,ease){ //the id to animate, the easing type
var animSpeed=2000; //set animation speed
var $container=$("#container"); //define the container to move
if(ease){ //check if ease variable is set
var easeType=ease;
} else {
var easeType="easeOutQuart"; //set default easing type
}
//do the animation
$container.stop().animate({"left": -($(id).position().left)}, animSpeed, easeType);
}
</script>
</body>
</html>no votes
-
-
28-05-2012, 15:32 #2
Verplaats al 's je scripts naar het einde van je pagina (nog binnen de body tags). En zet ook je apis daar nét boven, niet in de heading van je website.
no votes
-
28-05-2012, 16:03 #3no votes
-
28-05-2012, 17:11 #4Deactivated user
- Registered
- 14/08/10
- Location
- Diest
- Posts
- 2,419
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 8/16
1. Gebruik code tags
2. Kuis je code wat op, post enkel de relevante stukken
3. Laad jQuery maar 1x in, niet 2x
4. Verduidelijk wat je wil
5. Post een test caseno votes
-
28-05-2012, 17:46 #5
het is gelukt, er waren dubbele scripts. Alleen kan ik de slider in de slider
niet dynamisch positioneren, hij moet mee bewegen als ik het scherm beweeg, en hij blijft op zijn vaste waarde staan
no votes
-
28-05-2012, 18:42 #6Deactivated user
- Registered
- 14/08/10
- Location
- Diest
- Posts
- 2,419
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 8/16
Als ge nog een vraag hebt, lees mijn vorige post dan opnieuw. Hier kunnen wij niks mee doen.
no votes
-
28-05-2012, 18:47 #7
het is gelukt, er waren dubbele scripts. Alleen kan ik de slider in de slider
niet dynamisch positioneren, hij moet mee bewegen als ik het scherm beweeg, en hij blijft op zijn vaste waarde staan
no votes
-
28-05-2012, 18:57 #8Deactivated user
- Registered
- 14/08/10
- Location
- Diest
- Posts
- 2,419
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 8/16
no votes

