CSS-Tricks

Forums Get help. Give help.

• schart February 21 Permalink

  
  $(document).ready(function(){
  
  $('a[href="#"]').click(function(){
  event.preventDefault();
  });
  $("#infol").click(function(){
  $("#wall").slideUp();
  $("#contact").slideUp();
  $("#info").slideToggle();
  });
  $("#walll").click(function(){
  $("#info").slideUp();
  $("#contact").slideUp();
  $("#wall").slideToggle();
  });
  $("#contl").click(function(){
  $("#info").slideUp();
  $("#wall").slideUp();
  $("#contact").slideToggle();
  });
  
  });

  
  
  Also, jQuery is loaded, it's just this part that doesn't work on Firefox or IE, it works on Safari and Chrome (webkit) though. Any suggestions?
• schart February 21 Permalink

  Note: Not even event.preventDefault() work's on Firefox/IE, but the weird thing is, my other jQuery code works just fine...
• sliver37 February 21 Permalink

  Try
  

  
  
  $('a[href="#"]').click(function(event){
  event.preventDefault();
  });
  
  

• jamy_za February 21 Permalink

  @silver37 is right, that should work.
  
  You are calling a variable that doesn't exist.
• schart February 21 Permalink

  Still not working :/ Thank's though :)
• jamy_za February 21 Permalink

  Try this:
  

  $(document).ready(function(){
  
  	$('a[href="#"]').click(function(e){
  		e.preventDefault();
  	});
  	$("#infol").click(function(){
  		$("#wall").slideUp();
  		$("#contact").slideUp();
  		$("#info").slideToggle();
  	});
  	$("#walll").click(function(){
  		$("#info").slideUp();
  		$("#contact").slideUp();
  		$("#wall").slideToggle();
  	});
  	$("#contl").click(function(){
  		$("#info").slideUp();
  		$("#wall").slideUp();
  		$("#contact").slideToggle();
  	});
  
  });

• schart February 21 Permalink

  Not working, but I know the problem is in the slideUp/slideToggle thingy. Maybe because the ones that slide up are sometimes already up, causing the whole code to break or something? I know this because I have a similar code on the settings page, without the preventDefault and it's not working properbly there either. When I click on either "infol", "walll" or "contl", it just doesn't do anything.
• schart February 21 Permalink

  And let my clear up. My main problem is the fact that they don't slide, not the event.preventDefault, I read your responses, they made sense and should work after I fix the other code.
• jamy_za February 21 Permalink

  Don't you have an html example? What do you mean by 'its not working'. How do you know it's not working?
  
  Create a little test on jsfiddle and we'll be able to help you quickly/easily.
  
  P.S. If you're using the js I added above, then the JS isn't 'breaking'. The syntax is fine. If you slideUp something that is already up, nothing will happen.
• schart February 21 Permalink

  http://schart.net/profile.php?id=1
  Try opening that in Mozilla, and clicking on the tabs. In chrome, the current one will slide up and the one you clicked on will slide down, while on Mozilla it won't work. I stated all of that above.
• schart February 21 Permalink

  http://jsfiddle.net/6XPKU/
• jamy_za February 21 Permalink

  Works fine for me in Chrome and Firefox 10.0.2.
• schart February 21 Permalink

  Not in Firefox 8.0.1 atleast. Any idea what might be the problem? Some of my users have been complaining
• jamy_za February 21 Permalink

  Do you have firebug?
  
  Open firebug, go to the console tab. Refresh the page. There should be an error, what does it say?
• Senff February 21 Permalink

  The problem with the particular jsfiddle you just posted, is that at the end of the JS code, there's another $(document).ready(function(){​ that shouldn't be there.
  
  Anyways, I actually just tested your page in Firefox 8.0.1 and.... it works just fine.
• schart February 21 Permalink

  Ok, great
• trav5567 February 22 Permalink

  I know im going at this the wrong way which is why i am asking for some help, I am wanting my script to work so that when the contact div is down and you click anywhere else on the page the contact div will animate back up. If you have any suggestions for making it smoother that would be great too:)
  
  Thanks!
  
  Here is a link for what i am trying to do
  
  

  $(document).ready(function() {
  		
  		$("a.contact-btn").toggle(
        		function () {
         			 $("#contact").animate( {"top": "0"}, 900, "linear" );
       		 },
        		function () {
          		$("#contact").animate( {"top": "-400px"}, 900, "linear" );
      	});
      	  
  
  		$('body').bind('click', function() {		
  			var position = $('#contact').css('marginTop');
  
  			if ( position != '-400px') {
  				$("#contact").animate( {"top": "-400px"}, 900, "linear" );
  			}
  		});
  });