2012-02-26 44 views
1

谢谢你给我机会得到帮助。页脚切换两个图像关闭

我想创建一个切换页脚(滑动面板)。

我发现下面的代码工作正常,但我希望能够关闭页脚与两个不同的按钮:我用来打开(#footer_button)和另一个图像(十字)放在内容( #footer_content)。

我应该如何继续使用此代码在此图像(#footer_button_2)上集成相同的功能?

非常感谢提前!

这里是一个打印屏幕:http://hpics.li/cb5b88a

这里是我使用的代码:

<script type="text/javascript"> 
jQuery(function($) { 
var slide = false; 
var height = $('#footer_content').height(); 
$('#footer_button').click(function() { 
    var docHeight = $(document).height(); 
    var windowHeight = $(window).height(); 
    var scrollPos = docHeight - windowHeight + height; 
    $('#footer_content').animate({ height: "toggle"}, 1000); 
    if(slide == false) { 
     if($.browser.opera) { //Fix opera double scroll bug by targeting only HTML. 
      $('html').animate({scrollTop: scrollPos+'px'}, 1000); 
     } else { 
      $('html, body').animate({scrollTop: scrollPos+'px'}, 1000); 
     } 
          slide = true; 
    } else { 
          slide = false; 
        } 
}); 
}); 
</script> 

回答

0

您可以将它们与昏迷像CSS分开:$( '#footer_button,#CrossImgID'):)

<script type="text/javascript"> 
jQuery(function($) { 
var slide = false; 
var height = $('#footer_content').height(); 
$('#footer_button, #CrossImgID').click(function() { 
    var docHeight = $(document).height(); 
    var windowHeight = $(window).height(); 
    var scrollPos = docHeight - windowHeight + height; 
    $('#footer_content').animate({ height: "toggle"}, 1000); 
    if(slide == false) { 
     if($.browser.opera) { //Fix opera double scroll bug by targeting only HTML. 
      $('html').animate({scrollTop: scrollPos+'px'}, 1000); 
     } else { 
      $('html, body').animate({scrollTop: scrollPos+'px'}, 1000); 
     } 
          slide = true; 
    } else { 
          slide = false; 
        } 
}); 
}); 
</script> 
+0

太谢谢你了,阿达斯!你摇滚!它现在工作正常! – 2012-02-26 12:37:50

+0

不用担心!那么,你能接受这个问题吗? – Adaz 2012-02-26 12:51:29