PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!
Moderator: General Moderators
Celauran
Moderator
Posts: 6427 Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada
Post
by Celauran » Wed Jan 25, 2012 7:40 pm
I can't see the head of the document. Did you remember to include jQuery?
Working code:
Code: Select all
<!DOCTYPE html>
<html>
<head>
<title>jQuery Slideshow</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.fadein img:gt(0)').hide();
setInterval(function(){
$('.fadein :first-child').fadeOut()
.next('img').fadeIn()
.end().appendTo('.fadein');},
3000);
});
</script>
<style type="text/css">
.fadein { position:relative; width:500px; height:332px; }
.fadein img { position:absolute; left:0; top:0; }
</style>
</head>
<body>
<div class="fadein">
<img src="http://farm3.static.flickr.com/2610/4148988872_990b6da667.jpg" />
<img src="http://farm3.static.flickr.com/2597/4121218611_040cd7b3f2.jpg" />
<img src="http://farm3.static.flickr.com/2531/4121218751_ac8bf49d5d.jpg" />
</div>
</body>
</html>
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 6:15 am
I have tried it with html tags and heads and body etc and still doesn't work. in fact the code that you sent me above doesn't work either! is there something wrong with jquery?
Celauran
Moderator
Posts: 6427 Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada
Post
by Celauran » Thu Jan 26, 2012 7:09 am
Maybe there's something wrong with your copy of jQuery. The code I posted above works just fine.
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 7:14 am
i just copied and pasted your code in a blank page and uploaded it on my live server though! where did you get your copy of jquery?
Celauran
Moderator
Posts: 6427 Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada
Post
by Celauran » Thu Jan 26, 2012 7:33 am
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 9:45 am
Thanks buddy. I used that jQuery script from the link that you sent and now your example works BUT my script doesn't still work for some reason!
Here is my current code:
Code: Select all
<!DOCTYPE html>
<html>
<head>
<title>jQuery Slideshow</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.fadein img:gt(0)').hide();
setInterval(function(){
$('.fadein :first-child').fadeOut()
.next('img').fadeIn()
.end().appendTo('.fadein');},
3000);
});
</script>
<style type="text/css">
.fadein { position:relative; width:500px; height:332px; }
.fadein img { position:absolute; left:0; top:0; }
</style>
</head>
<body>
<div class="fadein">
<?php
// Connects to your Database
mysql_connect("localhost", "databaseusername", "password") or die(mysql_error()) ;
mysql_select_db("databse") or die(mysql_error()) ;
//Retrieves data from MySQL
$data = mysql_query("SELECT * FROM employees LIMIT 3") or die(mysql_error());
echo "<div class=\"fadein\">";
while($info = mysql_fetch_array( $data ))
{
//Outputs the image and other data
echo "<img src=images22/{$info['uploaded']} />";
}
echo "</div>";
?>
</body>
</html>
What am I doing wrong? am I missing something?
Celauran
Moderator
Posts: 6427 Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada
Post
by Celauran » Thu Jan 26, 2012 9:48 am
It looks OK. Can you post the final HTML?
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 9:55 am
Code: Select all
<!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>jQuery Slideshow</title>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.fadein img:gt(0)').hide();
setInterval(function(){
$('.fadein :first-child').fadeOut()
.next('img').fadeIn()
.end().appendTo('.fadein');},
3000);
});
</script>
<style type="text/css">
.fadein { position:relative; width:500px; height:332px; }
.fadein img { position:absolute; left:0; top:0; }
</style>
</head>
<body>
<div class="fadein">
<?php
// Connects to your Database
mysql_connect("localhost", "databseusername", "password") or die(mysql_error()) ;
mysql_select_db("database") or die(mysql_error()) ;
//Retrieves data from MySQL
$data = mysql_query("SELECT * FROM employees LIMIT 3") or die(mysql_error());
echo "<div class=\"fadein\">";
while($info = mysql_fetch_array( $data ))
{
//Outputs the image and other data
echo "<img src=images22/{$info['uploaded']} />";
}
echo "</div>";
?>
</body>
</html>
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 9:59 am
The code above crashes my browser for some strange reason!! it also puts the images on the top of eachother and it doesn't remove the last image before showing the the next image and then it will crash my browser.
Celauran
Moderator
Posts: 6427 Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada
Post
by Celauran » Thu Jan 26, 2012 10:10 am
You've got nested <div class="fadein"> which could be problematic. I'd still like to see the final rendered HTML, though I understand that may be tough if your browser keeps crashing.
crf121359
Forum Newbie
Posts: 14 Joined: Wed Jan 25, 2012 3:04 pm
Post
by crf121359 » Thu Jan 26, 2012 10:17 am
I tried everything. I even put the php part outside of html body and still doesn't work!!! I guess I'm gonna have to hire someone to get this done. Thanks ever so much for your time and help.