Page 2 of 2 FirstFirst 12
Results 11 to 19 of 19

Thread: Regarding to have dot navigation in slider

  1. #11
    Join Date
    Oct 2013
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Yes you are right john but is there any way to get less number of dots & one dot will cause 3 or 4 items to slide? so if total number of items are 10 & at a time we are able to see 4 items in slider then I want to show 3 dots i.e. 10/4 = 2.5 = 3 dots (consisting of 4 items to slide)

    Can you please help with this? & John me too did some customization like following :-

    Code:
    for(i=0; i<diff; i++)
    {
       jQuery('.ca-nav-next').trigger('click');
    }
    This loop will call number of next slide to display......means if I load the page then current slide will show me 4 items....now if I click on 3 then it should slide 2 times right john? the above loop will do the same but unfortunately loop is running 2 times but it only triggers click 1 time do you know why this is like so?

    Thanks
    Kaushal

  2. #12
    Join Date
    Oct 2013
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Here is the full code of javascript which I wrote for dots
    Code:
    <script>
    function sliding(v)
    {
        var diff = Math.abs(document.getElementById('sliding_current').value - v);
    
        if(document.getElementById('sliding_current').value == v)
        {
            return false;
        }
        if(document.getElementById('sliding_current').value < v) // do next
        {
            var i=0;
            for(i=0; i<diff; i++)
            {
                jQuery('.ca-nav-next').trigger('click');
            }
        }
        else // do previous
        {
            var i=0;
            for(i=0; i<diff; i++)
            {
                jQuery('.ca-nav-prev').trigger('click');
            }
        }
        document.getElementById('sliding_current').value=v;
    }
    </script>
    <input type="hidden" name="sliding_current" id="sliding_current" value="1">
    <ul>
            <li id="1" onclick="sliding('1')">1</li>
            <li id="2" onclick="sliding('2')">2</li>
            <li id="3" onclick="sliding('3')">3</li>
            <li id="4" onclick="sliding('4')">4</li>
        </ul>
    by default sliding_current's value will be 1. Hope this helps

    Thanks
    Kaushal

  3. #13
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    As long as it works for you, that's fine with me.
    - John
    ________________________

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

  4. #14
    Join Date
    Oct 2013
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Code:
    for(i=0; i<diff; i++)
            {
                jQuery('.ca-nav-next').trigger('click');
            }
    In above code if the loop is running 2 times then jQuery('.ca-nav-next').trigger('click'); this statement is executing only once. Any idea why is it so? I am very close John.

    Thanks
    Kaushal

  5. #15
    Join Date
    Oct 2013
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Or you can also give any js code which will slide all 3 or 4 items at a time. I will include that js.

    Thanks
    Kaushal

  6. #16
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    I'm a little confused. First you wanted dot navigation. You got that. Now you seem to want to have the slider move more than one slide at a time. The original script actually allows for that, but it's either one slide at a time or 2 or 3. I think if you can fit more slides in the viewable area, like your demo where there are 4 that fit into that area, you can do more, but the script code would have to be changed because it has a limit of 3.

    In any case, I just looked at your demo page again, and it looks like it's working the way you've been saying that you want it too.

    Is there still a problem?
    - John
    ________________________

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

  7. #17
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    Edit: Although these look promising, there might still be some problems with them


    After seeing what you have there, or had there when I posted my last message, which I think you must have used a different script for, if you want to use the script you originally asked about, I have two new demos for you. They both use the same updated script and css, which if you're interested in I can link you to. Each has some differences in markup, but those are right on the page. The first steps by 4 and is truly continuous, has a circle button for each item that tracks where you are, and the 'More' links still work:

    http://home.comcast.net/~jscheuer1/s...el/index2.html

    and this one which looks essentially the same as what you had up last I checked. With it you move 4 panes at a time and there's a circle button for each panel of 4 items, and blank panels are used so that the total is evenly divisible by 4 (actual panels could and ideally should be used in place of these), no 'More' links allowed (they can be there, but they will be disabled and hidden because, if they were used, they would screw up the tracking/navigation of the circle buttons):

    http://home.comcast.net/~jscheuer1/s...el/index3.html

    Edit: Although these look promising, there might still be some problems with them


    Edit: Oct 12th, 2013 - Just updated the main script to fix problem with expanding contracting using more button (affects index2 page only)
    Last edited by jscheuer1; 10-12-2013 at 06:59 AM.
    - John
    ________________________

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

  8. #18
    Join Date
    Oct 2013
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks John for your kind help

    Your 2nd demo was the thing I were looking for more slides but less dots.

    Thanks John for such a nice help

    Thanks
    Kaushal

  9. #19
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    You're welcome. If you need any help finding the files or configuring it to your setup, let me know.
    - John
    ________________________

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

Similar Threads

  1. Resolved Navigation arrows for Featured Content Slider
    By Paramasivan in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 09-09-2013, 08:29 PM
  2. Dynamic Drive Content Slider Navigation
    By element059 in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 08-08-2011, 01:41 PM
  3. need similar to "Featured Content Slider" but want navigation to be vertical
    By stolen_gtr in forum Looking for such a script or service
    Replies: 1
    Last Post: 10-04-2010, 11:01 AM
  4. Replies: 0
    Last Post: 08-05-2010, 08:17 PM
  5. Featured Content Slider v2.4 - one slider with several paginate-slider
    By beathead in forum Dynamic Drive scripts help
    Replies: 4
    Last Post: 08-05-2008, 09:05 AM

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
  •