Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image slideshow with PHP and MYSQL

    Hello,

    I am trying to create a slideshow that will show images and texts that has been saved into database.

    I managed to show the images in a slideshow using jQuery and PHP but there are a few problems which I don't know how to solve!!

    1- every time the slideshow page's refreshed the slideshow will jump back to the first image that it was showing even though it was showing th eimage third or fourth before refresh! HOw can I solve this issue?

    2- I just need to show each image for a limited time and ONLY once. I don't want the images to loop. for example the images will be shown for 1 minute and then they will never be shown again but I don't want to delete them from the server or database! How can I do this?


    You can view my current code here:

    PHP Code:
              <?php
    // Connects to your Database
    mysql_connect("localhost""DB_ username""DB_password") or die(mysql_error()) ;
    mysql_select_db("DB_name") or die(mysql_error()) ;

    //Retrieves data from MySQL
    $data mysql_query("SELECT * FROM employees") or die(mysql_error());

    echo 
    "<div class=\"fadein\">";
    while(
    $info mysql_fetch_array$data ))
    {
      
    //Outputs the image and other data
      
    echo "<img height=\"290\" width=\"360\" src=\"images22/{$info['uploaded']}\" />";
    }
    echo 
    "</div>";
    ?>
    and here is the jQuery code that I used:

    Code:
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/s3Slider.js" type="text/javascript"></script> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="style/main.css"/>
    
    <script type="text/javascript" src="js/jquery-latest.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');},
     * * * * * * *60000);
     * * * *});
    </script>

    Cheers

  • #2
    Regular Coder
    Join Date
    Jan 2012
    Posts
    271
    Thanks
    2
    Thanked 65 Times in 65 Posts
    i think you need to find the configuration options in js/s3Slider.js so the images don't loop...

    prob also for not starting at the start too.. there may be a setting to define the start image and you would prob need to either set a cookie on the browser or write info to the db so when the page is reloaded s3slider knows where to start...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •