Results 1 to 3 of 3

Thread: Navigating basic jquery-slider gallery by clicking on images

  1. #1
    Join Date
    Feb 2013
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Navigating basic jquery-slider gallery by clicking on images

    Hi All

    I have another question regarding the following page:

    http://www.catherinehyland.co.uk/test/testslider.html

    I am attempting to adapt the basic jquery slider. The user would like to be able to have the added option on the slider page of clicking through the images by clicking on the images. Currently the only way to move through the images is by using the numbers below. Essentially I need a function that will only navigate 'next' images by clicking on the slide, a 'previous' option is unnecessary.

    Any comments greatly appreciated

    All the best

    Samuel

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Since there doesn't appear to be any api documentation with this script nor any obvious access to a given slider instance, we can use its own nav buttons and a little style and jQuery to perform this. First in the on page call, set showcontrols to true and add code to activate the next control when a slide is clicked:

    Code:
          <script class="secret-source">
            jQuery(document).ready(function($) {
    
              $('#banner-fade').bjqs({
                height      : 770,
                width       : 930,
    			showcontrols : true,
    			automatic : false,
                numImagesToPreload: 6,
    			loop: true,
        loopRewind: true,
              });
    $('.bjqs-slide').click(function(){$('.bjqs-next a').click();});
            });
          </script>
    So that these controls will not be seen, in the stylesheet, set the controls to display none (line 5 bjqs.css):

    Code:
    ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;display:none;}
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Feb 2013
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thank you

    Thank you so much, great help!

Similar Threads

  1. Navigating JS gallery by clicking on images
    By samslystone in forum JavaScript
    Replies: 2
    Last Post: 04-19-2013, 04:58 PM
  2. Slider or Gallery that rotate's web pages, rather than images -- does such exist?
    By Rick Kean in forum Looking for such a script or service
    Replies: 1
    Last Post: 12-14-2012, 02:59 PM
  3. Content Slider stops auto rotating after clicking next
    By xrdxkunx in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 10-05-2010, 11:12 PM
  4. Randomize Content Slider by clicking on Image
    By deeksha in forum Dynamic Drive scripts help
    Replies: 6
    Last Post: 05-29-2010, 02:07 PM
  5. JQuery Slider Gallery help
    By IC619 in forum JavaScript
    Replies: 0
    Last Post: 10-29-2008, 07:27 PM

Bookmarks

Posting Permissions

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