5 Replies - 3358 Views - Last Post: 22 April 2009 - 01:55 PM

#1 gregwhitworth   User is offline

  • Tired.
  • member icon

Reputation: 221
  • View blog
  • Posts: 1,613
  • Joined: 20-January 09

IE7/6 issue with switchClass

Posted 20 April 2009 - 03:47 PM

Ok.

So here is the issue - I have a sliding navigation of a portfolio section. It works wonders in FF but breaks in IE. In IE 7 it will slide once, then no more. In IE 6 it won't slide at all. Any suggestions.

$(document).ready(function(){
						$(function() {
						$('a.nav').click(function() {
							$('#scrollingPort').switchClass($('#scrollingPort').attr('class'),$(this).attr('rel'), 1000);
							return false;
						});
					});
					
				});



==

Greg

Is This A Good Question/Topic? 0
  • +

Replies To: IE7/6 issue with switchClass

#2 gregwhitworth   User is offline

  • Tired.
  • member icon

Reputation: 221
  • View blog
  • Posts: 1,613
  • Joined: 20-January 09

Re: IE7/6 issue with switchClass

Post icon  Posted 22 April 2009 - 09:55 AM

Ok.

So here is the issue - I have a sliding navigation of a portfolio section. It works wonders in FF but breaks in IE. In IE 7 it will slide once, then no more. In IE 6 it won't slide at all. Any suggestions.

CODE
$(document).ready(function(){
						$(function() {
						$('a.nav').click(function() {
							$('#scrollingPort').switchClass($('#scrollingPort').attr('class'),$(this).attr('rel'), 1000);
							return false;
						});
					});
				   
				});




You can see a working/non-working version here: http://www.msialaska...olio/print.html

I am trying my best to understand the issue here - I have tested it by adding an alert to make sure that IE6 recognizes the .click function and it does, but there is no class set so I am assuming that the .switchClass is the issue.

I have tried looking through the jQuery User Interface code but it is a giant cube of code (not tabbed out) and I don't have the time to try and figure it out.

Please help.

Thanks.

==

Greg
Was This Post Helpful? 0
  • +
  • -

#3 girasquid   User is offline

  • Barbarbar
  • member icon

Reputation: 109
  • View blog
  • Posts: 1,825
  • Joined: 03-October 06

Re: IE7/6 issue with switchClass

Posted 22 April 2009 - 10:32 AM

If someone hasn't responded to your topic in 2 days, chances are it's because they're not sure how to help you - reposting the same thing is unlikely to get you any better results.

When you first download the customized package of jQuery UI, the 'development-js' folder will have the non-minified code available for you to look through.

Are you sure that switchClass is the best way to achieve what you're looking for? If all you want is sliding, you can easily do the same thing using just animate, which is within the jQuery core.
Was This Post Helpful? 0
  • +
  • -

#4 gregwhitworth   User is offline

  • Tired.
  • member icon

Reputation: 221
  • View blog
  • Posts: 1,613
  • Joined: 20-January 09

Re: IE7/6 issue with switchClass

Posted 22 April 2009 - 11:00 AM

No I'm not sure that it's the best option - what happens is when you click on the image it switches the class of the mother div to a class that has a negative margin, thus sliding it. If you have a better method to getting another div to move to the left -700px depending on which anchor is clicked - I AM ALL EARS.

Please, help, I am willing to learn new methods and appreciate you simply reading the message.

Thanks again.

--

Greg
Was This Post Helpful? 0
  • +
  • -

#5 girasquid   User is offline

  • Barbarbar
  • member icon

Reputation: 109
  • View blog
  • Posts: 1,825
  • Joined: 03-October 06

Re: IE7/6 issue with switchClass

Posted 22 April 2009 - 01:01 PM

Unfortunately, it's been a while since I had to write code like this, so I'm a little fuzzy on how exactly I achieved it - but you can see a sliding effect that I built at http://enlighten.jeshderox.com. This is the code that does the sliding:
$(document).ready(function() {
	$('a.scroller').click(function() {
		var obj = $($(this).attr('rel'));	//	get target 'li' for y position
		var par = obj.parent().parent(); 	//	get containing 'li' for x positioning.
		$('#mainItems').animate({top:'-' + obj.css('top')},700,'easeInOutCubic', function(){
			$('#mainItems').animate({left:'-' + par.css('left')},700,'easeInOutCubic');
		}); 					
		location.hash = $(this).attr('href');
		return false;
	});

	if(location.hash) {
		$('a.scroller[href=' + location.hash + ']:first').click();		
	}
});



Essentially, every <a> tag with the class 'scroller' also has a rel attribute that is storing the ID of the element that we want to slide to. Then, we animate the container for all of the elements to a certain position, based on the left and top attributes of the element we're animating to.

This should get you started - if you're still having trouble, paste your code and I'll try to help you out.
Was This Post Helpful? 0
  • +
  • -

#6 gregwhitworth   User is offline

  • Tired.
  • member icon

Reputation: 221
  • View blog
  • Posts: 1,613
  • Joined: 20-January 09

Re: IE7/6 issue with switchClass

Posted 22 April 2009 - 01:55 PM

Thanks for the reply - I unfortunately found something that works fine in all browsers in the forum lull, sorry about that. Just for other users and future reference check it out here:

http://jqueryfordesi...-slider-effect/

--

Greg
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1