Results 1 to 6 of 6

Thread: Horizontal Div overflow scroller, on image hover?

  1. #1
    Join Date
    Jul 2010
    Location
    Bridport, Dorset
    Posts
    58
    Thanks
    6
    Thanked 1 Time in 1 Post

    Question Horizontal Div overflow scroller, on image hover?

    Hi Guys,
    First post, but I have used this website for ages for ideas and code for various websites.
    My apologies if this is in the wrong place, I seem to manage to always get on the wrong side of the mods..

    My problem is I can not find anywhere a script to make an image (left and right arrow) control the scrolling for a horizontal div that overflows to the right.

    I am working on this site, it is in the building stage... http://www.test.steptoes.co.uk

    So you can see the first horizontal index at the top of the page (shoes) has a standard scroller on it, I need to remove that and place an arrow at either end, then I want to hover on that arrow to scroll through the products from left to right, I have found a few scripts that go up and down, but I cant seem to convert them for horizontal scrolling.

    I would be extremely pleased if anyone can find any such script, I have searched high and low.

    Thanks for your time, I look forward to a reply.

  2. #2
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Can't come up with ideas that match exactly what you describe, but maybe you can use this instead ?
    http://www.dynamicdrive.com/dynamici...iongallery.htm

  3. The Following User Says Thank You to azoomer For This Useful Post:

    lilpete (07-08-2010)

  4. #3
    Join Date
    Jul 2010
    Location
    Bridport, Dorset
    Posts
    58
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    i do like that! I will have a go at implementing that one.

    Thanks azoomer!

  5. #4
    Join Date
    Jul 2010
    Location
    Bridport, Dorset
    Posts
    58
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    Azoomer, check it, it works!
    http://www.test.steptoes.co.uk/

  6. #5
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    That was quick. It works very well and you can adjust it further in the gallerystyle.css. I tried this
    Code:
    #motioncontainer a img {
    border:none;
    outline:none;
    margin-top:24px;
    }
    #motioncontainer a:hover img {
    border:none;
    outline:none;
    }
    and thought it looked good. You could even set a background image in
    Code:
    #motioncontainer {
    height:130px;
    width:100%;
    background:url("your-background-image.jpg");
    }
    if you want to have some arrows or some kind of indicators to help the users understand the functionality. But that's all up to you. Well done.

  7. #6
    Join Date
    Jul 2010
    Location
    Bridport, Dorset
    Posts
    58
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    Hi, Im back again, yeah, I thought I would get it done that afternoon, Ive been on a long weekend...
    I have found that as soon as I add that script to any of the other tabs on that page it looses functionality.. I think it is due to duplicated id's.
    Is there anyway to use this script more than once on a page?
    Thanks for you help..

    EDIT: Dont worry, started new thread on this question...
    Dynamic Drive Forums > DD Scripts > Dynamic Drive scripts help > CMotion Gallery more than once on a page?
    Last edited by lilpete; 07-13-2010 at 02:21 PM. Reason: Started new thread..

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
  •