0

我正在尝试向网站添加 Facebook 滑出式框，并且该机制在 Chrome 中运行良好，但在 Firefox 和 IE 中，它不会一直缩回，也不会用背景颜色。谁能让我知道我错过了什么？

实时 URL 是： http: //www.campyavneh.org/social-network-slider-test

这是一个 JS Fiddle，它似乎在两种浏览器中都运行良好，所以我不确定我在现场网站上搞砸了什么：http: //jsfiddle.net/U9nw6/8/这是必要的代码：

    <script>
jQuery(function($) {
    $(document).ready(function() {
        $('#panelHandle').hover(function() {
            $('#sidePanel').stop(true, false).animate({
                'left': '0px'
            }, 900);
        }, function() {
            jQuery.noConflict();
        });

        jQuery('#sidePanel').hover(function() {
            // Do nothing
        }, function() {

            jQuery.noConflict();
            jQuery('#sidePanel').animate({
                left: '-201px'
            }, 800);

        });
    });
});
</script>

    /* Slide out social networking */
    #sidePanel {
        width:292px;
        position:fixed;
        left:-292px;
        top:15%;
        height:590px;
    }
    #panelHandle {
        height:128px;
        width:40px;
        border-radius:0 5px 5px 0;
        float:left;
        cursor:pointer;
    }
    #panelContent {
        float:left;
        width:292px;
        height:590px;
        background-color:#EEEEEE;
    }
    #panelHandle img {
        left: 292px;
        position: relative;
        top: -590px;
    }

<div id="sidePanel">
        <div id="panelContent">
          <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fcampyavneh&amp;width=292&amp;height=590&amp;show_faces=true&amp;colorscheme=light&amp;stream=true&amp;border_color&amp;header=true&amp;appId=132179142482" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:590px;" allowTransparency="true"></iframe>     
        </div>
    <div id="panelHandle"><img src="/sites/all/themes/yavneh/images/fb_logo_side.jpg" alt="Facebook"></div>
</div>​

感谢您的任何帮助，您可以提供！

4

3 回答 3

0

对于背景问题，您需要在 div iframe 标签中添加一行，应该是这样的：

背景：#ccc

其中#ccc 可以是十六进制代码或您要填充的任何颜色

于 2013-01-26T20:42:38.223 回答
0

将 iframe 更改为

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fcampyavneh&amp;width=292&amp;height=590&amp;show_faces=true&amp;colorscheme=light&amp;stream=true&amp;border_color&amp;header=true&amp;appId=132179142482" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:590px;" allowTransparency="true"></iframe>
于 2013-03-10T19:32:56.590 回答
0

将#sidePanel 处理更新为：

jQuery('#sidePanel').hover(function() {
  jQuery.noConflict();
  jQuery('#sidePanel').animate({
    left: '-201px'
  }, 800);
 });
于 2014-03-23T14:45:56.487 回答