De PHPhulp kroeg
gezocht php mysql slideshow
ik ben op zoek naar een slideshow script voor mysql.
ik heb zo iets gezien bij mijn nichtje op habbo.
wie kan mij helpen?
svenvideo
Gewijzigd op 30/05/2011 07:53:03 door Sven video
Zoek eens op google zou ik zeggen, er is vast wel iets te vinden richting wat je zoekt.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// Fade effect only in IE; degrades gracefully
// =======================================
// set the following variables
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 4000
// Duration of crossfade (seconds)
var crossFadeDuration = 2
// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'
// =======================================
// do not edit anything below this line
// =======================================
var t
var j = 0
var p = Pic.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
function runSlideShow(){
if (document.all){
document.images.SlideShow.style.filter="blendTrans(duration=2)"
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow.filters.blendTrans.Apply()
}
document.images.SlideShow.src = preLoad[j].src
if (document.all){
document.images.SlideShow.filters.blendTrans.Play()
}
j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
}
// http://www.codelifter.com
// Free for all users, but leave in this header
// Fade effect only in IE; degrades gracefully
// =======================================
// set the following variables
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 4000
// Duration of crossfade (seconds)
var crossFadeDuration = 2
// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'
// =======================================
// do not edit anything below this line
// =======================================
var t
var j = 0
var p = Pic.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
function runSlideShow(){
if (document.all){
document.images.SlideShow.style.filter="blendTrans(duration=2)"
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow.filters.blendTrans.Apply()
}
document.images.SlideShow.src = preLoad[j].src
if (document.all){
document.images.SlideShow.filters.blendTrans.Play()
}
j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
}
Gewijzigd op 30/05/2011 10:10:52 door John D
http://fancybox.net/
http://jquery.malsup.com/cycle/
Hier een super simpele demo:
http://jquery.malsup.com/cycle/basic.html
Voor de code, bekijk de bron. Die <img> tags kun je wel maken door de url's van de afbeeldingen uit je database te halen.
http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider
dat ik er sql van kan maken?
<!doctype html>
<html>
<head>
<title>JQuery Cycle Plugin - Example Slideshow</title>
<style type="text/css">
.slideshow { height: 232px; width: 232px; margin: auto }
.slideshow img { padding: 15px; border: 1px solid #ccc; background-color: #eee; }
</style>
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
<!-- initialize the slideshow when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
</head>
<body>
<div class="slideshow">
<img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
<img src="http://cloud.github.com/downloads/malsup/cycle/beach2.jpg" width="200" height="200" />
<img src="http://cloud.github.com/downloads/malsup/cycle/beach3.jpg" width="200" height="200" />
<img src="http://cloud.github.com/downloads/malsup/cycle/beach4.jpg" width="200" height="200" />
<img src="http://cloud.github.com/downloads/malsup/cycle/beach5.jpg" width="200" height="200" />
</div>
</body>
</html>
Gewijzigd op 31/05/2011 12:51:22 door sven video
<img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
maar ik krijg niks te zien.
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<?php
mysql_connect("", "", "") or die(mysql_error());
mysql_select_db("") or die(mysql_error());
$result = mysql_query("SELECT * FROM link_ads WHERE categorie = 'pretpark'");
?>
mysql_connect("", "", "") or die(mysql_error());
mysql_select_db("") or die(mysql_error());
$result = mysql_query("SELECT * FROM link_ads WHERE categorie = 'pretpark'");
?>
<!doctype html>
<html>
<head>
<title>JQuery Cycle Plugin - Example Slideshow</title>
<style type="text/css">
.slideshow { height: 232px; width: 232px; margin: auto }
.slideshow img { padding: 15px; border: 1px solid #ccc; background-color: #eee; }
</style>
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
<!-- initialize the slideshow when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
</head>
<body>
<div class="slideshow">
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<?
while($row = mysql_fetch_array( $result ))
{
echo '<IMG SRC="/atracties/upload/' . $row['bestand'] . '" WIDTH="250" HEIGHT="242"></a>';
}
?>
while($row = mysql_fetch_array( $result ))
{
echo '<IMG SRC="/atracties/upload/' . $row['bestand'] . '" WIDTH="250" HEIGHT="242"></a>';
}
?>
</div>
</body>
</html>
Toevoeging op 31/05/2011 13:31:28:
laat maar gelukt!
Zet die ook even neer.
<img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
nou dit
<html>
<head>
<title>JQuery Cycle Plugin - Example Slideshow</title>
<style type="text/css">
.slideshow { height: 232px; width: 232px; margin: auto }
.slideshow img { padding: 15px; border: 1px solid #ccc; background-color: #eee; }
</style>
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
<!-- initialize the slideshow when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'zoom' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
</head>
<body>
<div class="slideshow">
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<?
while($row = mysql_fetch_array( $result ))
{
echo '<TR><TD><a href="pretpark2.php?id=' . $row['id'] . '" ><IMG SRC="/atracties/upload/' . $row['bestand'] . '" WIDTH="505" HEIGHT="485"></a>';
}
?>
while($row = mysql_fetch_array( $result ))
{
echo '<TR><TD><a href="pretpark2.php?id=' . $row['id'] . '" ><IMG SRC="/atracties/upload/' . $row['bestand'] . '" WIDTH="505" HEIGHT="485"></a>';
}
?>
</div>
</body>
</html>
Toevoeging op 31/05/2011 14:02:51:
hoe werkt jquery?
want ik wil wat in voegen van deze website:
http://jquery.malsup.com/cycle/int2.html
deze:
Pager,
Callbacks
#flauw
Vincent Huisman op 31/05/2011 14:15:58:
Daar staat helemaal uitgelegd hoe het moet. als je niet weet wat jquery is, zoek je dat maar op
Toevoeging op 31/05/2011 14:31:40:
Vincent Huisman op 31/05/2011 14:15:58:
Daar staat helemaal uitgelegd hoe het moet. als je niet weet wat jquery is, zoek je dat maar op
help aub
Sven video op 31/05/2011 14:31:19:
Toevoeging op 31/05/2011 14:31:40:
help aub
Vincent Huisman op 31/05/2011 14:15:58:
Daar staat helemaal uitgelegd hoe het moet. als je niet weet wat jquery is, zoek je dat maar op
Toevoeging op 31/05/2011 14:31:40:
Vincent Huisman op 31/05/2011 14:15:58:
Daar staat helemaal uitgelegd hoe het moet. als je niet weet wat jquery is, zoek je dat maar op
help aub
Sven, kappen! Je leest niet en je wilt zelf geen ene kloot uitvoeren. Google zelf eens op 'jQuery uitleg' of iets anders!