turns out it was indeed the CSS statement. I'm not exactly sure what
the specific issue was, but I believe it was my varying css styles
that didn't carry over. EG: I had backgroundBottom:none on some items,
styles on some, and simply 0px on others. Streamlining it and keeping
the styles linear helped.
Previously I had issues maintaining the border color, however I added
it outside of the animate function and it works fine.
Thanks for all your help and attention!
On Aug 17, 10:23 pm, "Michael Geary" <m...@mg.to> wrote:
> If you double-click each of the entries in the call stack it will go to the
> code for that function call.
>
> Down near the bottom of the list, one of them points to this code:
>
> $clicked.animate({
> opacity: 1,
> "borderBottom":"5px solid #0099CC"
> }, 300 );
>
> I don't know off the top of my head what might be wrong there. I wonder if
> you need to use an individual CSS style such as borderBottomWidth instead of
> the shortcut style borderBottom? I would experiment with that. What is it
> exactly that you want to animate - the width, the color, or what?
>
> Also, this line:
>
> $clicked = $(this);
>
> should probably be:
>
> var $clicked = $(this);
>
> -Mike
>
> > From: ninjagowoowoo
>
> > Right on, I figured that may come up but I was hoping it was
> > just some silly syntax error. The error now breaks at line
> > 3909 (Same error [invalid argument]) on jquery 1.3.2
> > uncompressed. The Call Stack simply says "JScript anonymous
> > function". It should also be noted that the above code isn't
> > a snippet, it's the whole document, and actually the only
> > jquery code I'm using. If you'd like to check out the site,
> > the working build is up athttp://redouglascom... although
> > I'm not sure how clean and organized the source is since I've
> > been messing with so many things. Enter at your own risk, heh.
>
> > On Aug 17, 9:25 pm, "Michael Geary" <m...@mg.to> wrote:
> > > 1. Use the uncompressed version of jQuery instead of the
> > minified one (i.e.
> > > jquery.js instead of jquery.min.js).
>
> > > 2. Load your page in IE8.
>
> > > 3. Open the IE8 debugger (F12 to open it).
>
> > > 4. Select the Script tab and make sure Break on Error is turned on
> > > (the pause/X button should look like it's pushed down).
>
> > > 5. Click your nav item to trigger the error.
>
> > > 6. Click the Call Stack button on the right.
>
> > > Now you should see not only the error inside jQuery, but
> > also the call
> > > stack showing what part of your code triggered the error.
>
> > > If that doesn't do it, post a link to a test page that demonstrates
> > > the problem. It's pretty hard to tell what might be wrong
> > from just a
> > > code snippet.
>
> > > -Mike
>
> > > > From: ninjagowoowoo
>
> > > > I've been having issues with my jquery code in IE. I've tried
> > > > various debugging methods but they tend to point into the actual
> > > > jquery js and not the code I've written. For what it's worth, the
> > > > debuggers tell me it's in line 19 of the jquery source. I'm using
> > > > 1.3.2 compiled code.
> > > > I'm really hoping this is a simple problem like a missing ; or
> > > > something but I can't find the problem and it's about to drive me
> > > > crazy, haha. My code works in Firefox and Safari, but IE
> > fails. to
> > > > start, here is my code:
>
> > > > (modified version of the one found at //modified from
>
> > >http://css-tricks.com/learning-jquery-fading-menu-replacing-content/)
>
> > > > ================begin Nav jquery code========== $(function(){
> > > > //init menu item css
> > > > $("#about-button").css({opacity:
> > > > 1,"border-bottom":"5px solid #0099CC"});
> > > > $("#portfolio-button").css({opacity:
> > > > 0.3,"border-bottom":"none"});
> > > > $("#resume-button").css({opacity:
> > > > 0.3,"border-bottom":"none"});
> > > > $("#contact-button").css({opacity:
> > > > 0.3,"border-bottom":"none"});
>
> > > > $("#page-wrap div.button").click(function(){
>
> > > > $clicked = $(this);
>
> > > > // if the button is not already
> > > > "transformed" AND is not animated
> > > > if ($clicked.css("opacity") != "1" &&
> > > > $clicked.is(":not
> > > > (animated)")) {
>
> > > > $clicked.animate({
> > > > opacity: 1,
>
> > > > "borderBottom":"5px solid #0099CC"
> > > > }, 300 );
>
> > > > var idToLoad =
> > > > $clicked.attr("id").split('-');
>
> > > > // search trough the
> > content for
> > > > the visible div and we fade it out
>
> > > > $("#content").find("div:visible").fadeOut("fast", function(){
> > > > //once the fade out is
> > > > completed, start to fade in the right div
>
> > > > $(this).parent().find("#"+idToLoad[0]).fadeIn();
> > > > })
> > > > }
>
> > > > // reset the other buttons to default
> > > > style
> > > > $clicked.siblings(".button").animate({
> > > > opacity: 0.3,
> > > > "borderBottom":"0px"
> > > > }, 300 );
>
> > > > });
> > > > });
>
> > > > ============END CODE===============
>
> > > > The error in IE does not occur until one of the nav items
> > > > (#resume- button etc) is clicked. I guess it should also be noted
> > > > that I am referencing this code in an external js file that is
> > > > separate from my html page.
>
> > > > Please if anyone can provide insight or at the very least
> > a point in
> > > > the right direction I'd greatly appreciate it.
