www.webdeveloper.com
Results 1 to 4 of 4

Thread: Current image count. jQuery slideshow

  1. #1
    Join Date
    May 2011
    Posts
    58

    Exclamation Current image count. jQuery slideshow

    Hello, I write simple slideshow on jQuery but I can't understand how to change current image count. Help me please.

    Here is my current code:
    HTML Code:
    <script type="text/javascript"> 
    	$(document).ready(function(){
    	$('#slideshow img').hide();
    	$('#slideshow img:first').show();
    	
    	function slide(){
    		var $top = $('#slideshow img:visible');
    		var $next;
    		
    		if ($top.next().length > 0)
    		$next = $top.next();
    		
    		else
    		$next = $('#slideshow img:first');
    		$top.hide();
    		$next.show();
    	}
    	var $imgCount = $('#slideshow img');
    	var $iCount = $imgCount.length;
     
    	$('#slideshow img').click(slide);
    	$('#totalImages').text($iCount);
    
    	});
    </script>
    I'm trying make like this 2/45, where 2 - is current image number.
    Thank you.

  2. #2
    Join Date
    May 2010
    Posts
    213
    I'm gonna give you a general idea, i didn't try to run the code so i'm not sure it works. The changes i've made are marked red, the code that i don't understand is grey because i'm not sure if it's supposed to go in the "else" block or not.

    Code:
    <script type="text/javascript"> 
    	$(document).ready(function(){
    	$('#slideshow img').hide();
    	$('#slideshow img:first').show();
    	
    	function slide(){
    		var $top = $('#slideshow img:visible');
    		var $next;
    		var $current = 1;
    		
    		if ($top.next().length > 0) {
    			$next = $top.next();
    			$current++;
    		} else {
    			$next = $('#slideshow img:first');
    			$current = 1;
    		}
    		$top.hide();
    		$next.show();
    
    		$('#currentImage').text($current + "/" + $iCount);
    	}
    	var $imgCount = $('#slideshow img');
    	var $iCount = $imgCount.length;
     
    	$('#slideshow img').click(slide);
    	$('#totalImages').text($iCount);
    
    	});
    </script>
    Last edited by 3Nex; 05-27-2011 at 04:35 AM.
    i love easter eggs
    (if you got any creative easter eggs, send me a PM)

  3. #3
    Join Date
    May 2011
    Posts
    58
    Thank you, but this is work only once, i.e. 1 changing to 2 and stop.
    This is very strange, because every time when click(slide) they must $current++
    Hm…

  4. #4
    Join Date
    May 2011
    Posts
    58
    I found a solution:

    Counter should be under function:
    HTML Code:
    var $current = 1;
    function slide(){
    		var $top = $('#slideshow img:visible');
    		var $next;

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles