jQuery Forum

Ok. Here is the issue - I figured it out (somewhat). The code given to me from someone else works great - except for one thing - I want people to be able to click on any link and have the div move to that position.

The issue I have right now is the classes are getting stacked, and the latest class holds precedence in the CSS - example after clicking 1, then 3, then 2:

jQuery:

$(function() {
   $('a.nav').click(function() {
      $('#scrollingPort').toggleClass($(this).attr('rel'));
      return false;
   });
});


[inline]<div id="scrollingPort" class="one three two">[/inline]

Thus whatever the settings of two are get set - but - only to an extent - here is my css:

CODE

.three {
                margin-left: -1400px;}
               
            .two {
                margin-left: -700px;
                background: yellow;}
               
            .one {
                margin-left: 0;}   

So even though in the classes two has the highest setting, the way that css is working - it will move back to one no matter what making it as though the thing doesn't work. I have tried numerous things from add and removeClass to rearranging the css. PLEASE HELP. Maybe if there was a way to just remove all of classes set and then add one - but I can't seem to get that to work.

You can see a working version here:

http://www.msialaska.com/portfolio/brochure.html

--
Greg