Jquery code working in Chrome but not in Firefox
I have this piece of code that reveals a couple of divs when it is clicked and then they are hidden once another link is clicked. I'm trying to get this to show in Firefox and it may not be a problem in the js but all help is greatly appreciated.
<script type="text/javascript">
$(document).ready(function(){
$('.fadein').click(function(){
// Make the id overview show
$('#header-contact').hide('slow');
$('#header-portfolio').show('slow');
$('#content-portfolio').show('slow');
// override default a behavior
return false;
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$('.fadein2').click(function(){
// Make the id overview show
$('#header-portfolio').hide('slow');
$('#header-contact').show('slow');
$('#content-portfolio').hide('slow');
// override default a behavior
return false;
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$('.fadein3').click(function(){
// Make the id overview show
$('#header-portfolio').hide('slow');开发者_StackOverflow社区
$('#header-contact').hide('slow');
$('#content-portfolio').hide('slow');
// override default a behavior
return false;
});
});
Try passing the event
to each of the click
handlers and before you return false
, call preventDefault()
on the passed-in event
object.
example:
$(document).ready(function(){
$('.fadeinX').click(function(e){
// Make the id overview show
$('#header-portfolio').hide('slow');
$('#header-contact').hide('slow');
$('#content-portfolio').hide('slow');
// override default a behavior
e.preventDefault();
return false;
});
});
Use Web Developer by Chris Pederic to clear the cache. I had exactly the same problem with Firefox and using the web developer to clear the cache solved it. Simple but you never know, and I had been pulling my hair out.
You actually don't need to return false
at all if you preventDefault();
$(document).ready(function(){
$('.fadein').click(function(e){
// Make the id overview show
$('#header-portfolio').hide('slow');
$('#header-contact').hide('slow');
$('#content-portfolio').hide('slow');
// override default a behavior
e.preventDefault();
});
});
Also move your JS into it's own file and only have one $(document).ready(function() {...})
function and you can put all three of your events in there.
精彩评论