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
    Apr 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry Mootools Carousel problems!

    Hi there

    The carousel I'm using on my site is skipping an image when I click on the 'next' arrow ie. #1 > #3 > #5 > #7.... The 'prev' arrow just isn't working fullstop.

    I'm a total novice at Javascript, so I'm at a total loss as to how I can fix this.

    Here's my site:
    http://stuseddon.co.uk/

    Here's my javascript:
    [CODE]window.addEvent('domready', function() {
    $$('.images').each(function(div) {
    var images = div.getElements('img');

    if(images.length > 1) {
    images.each(function(img, i) {
    img.set('morph', {duration: 500, link: 'cancel'});

    if(i > 0) {
    img.setStyle('opacity', 0);
    }
    });

    var e = images.length * 1000;

    var prev = new Element('a', {'class': 'prev'}).inject(div);
    var next = new Element('a', {'class': 'next'}).inject(div);

    var arrows = $$(prev, next);
    arrows.setStyle('opacity', 0).set('morph', {duration: 100, link: 'cancel'});

    div.addEvents({
    mouseenter: function() {
    arrows.morph({opacity: 0.33});
    },
    mouseleave: function() {
    arrows.morph({opacity: 0});
    }
    });

    arrows.addEvents({
    mouseenter: function() {
    this.morph({opacity: 1});
    },
    mouseleave: function() {
    this.morph({opacity: 0.33});
    }
    });

    prev.addEvent('click', function() {
    e--;

    images.morph({opacity: 0});
    images[e % images.length].morph({opacity: 1});
    });

    next.addEvent('click', function() {
    e++;

    images.morph({opacity: 0});
    images[e % images.length].morph({opacity: 1});
    });

    div.addEvent('click', function(e) {
    if($(e.target).get('tag') != 'a') {
    next.fireEvent('click');
    }
    });

    div.addEvent('selectstart', function(e) {
    e.stop();
    });
    }
    else {
    div.setStyle('cursor', 'default');
    }
    });
    });[CODE]

    Please help! Thanks in advance.

  • #2
    New to the CF scene
    Join Date
    Apr 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    All resolved now.
    The JQuery was clashing with Mootools!


  •  

    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
    •