Question

我有一个用这些参数表示的jQuery菜单：

<script type="text/javascript">
            jQuery(document).ready(function(){


                jQuery('#promo').pieMenu({icon : [
                        { 
                            path : "/wp-content/themes/Tersus/images/piemenu/winamp.png",
                            alt  : "Winamp",
                            fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.pls';return false}
                        },  { 
                            path : "/wp-content/themes/Tersus/images/piemenu/vlc.png",
                            alt  : "VLC Media Player",
                            fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.pls';return false}  
                        },{ 
                            path : "/wp-content/themes/Tersus/images/piemenu/QuickTime.png",
                            alt  : "Quick Time Player",
                            fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.qtl';return false}
                        },{ 
                            path : "/wp-content/themes/Tersus/images/piemenu/WMP.png",
                            alt  : "Windows Media Player",
                            fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.asx';return false}
                        },{ 
                            path : "/wp-content/themes/Tersus/images/piemenu/popup.png",
                            alt  : "נגן Popup",
                            fn   : function(){$("#popupplay").click();return false}
                        },{ 
                            path : "/wp-content/themes/Tersus/images/piemenu/iTunes.png",
                            alt  : "iTunes",
                            fn   : function(){alert('...בקרוב');return false}
                        }],
                    beforeMenuOpen: function(){
                        jQuery('<div id="shadow"></div>').css(
                        {
                            'position':'fixed',
                            'background-color':'#000000',
                            'opacity': 0.6,
                            'width':'100%',
                            'height':'100%',
                            'z-index' :999,
                            'top':0,
                            'left':0
                        }).appendTo('body');
                    },
                    beforeMenuClose: function(){
                        jQuery('#shadow').remove();
                    }
                });
            });

        </script>

右键单击操作该菜单。我需要改变它来悬停。

该插件的作者给出了一个插入内容的片段：

$(document).ready(function(){
//init my jPie
   var jPieMenu = $(#myelement').pieMenu({icon : [ { 
                               path : "path/to/images.png",
                               alt  : "icon",
                               fn   : function(){alert('Click:: icon');return false;}
                          }] });
   $('#myelement').hover(function(){
      if($('#'+jPieMenu.id).css('display') != 'block') //if jpie is not visible
          jPieMenu.initMenu(200,200);
   })
})

唯一的问题是我不知道在哪里插入和什么..我总是得到意外的令牌。有人可以查看我上面的代码并建议插入它的位置吗？

提前完成。

Answer 1

您只需将$('#myelement').pieMenu声明替换为现有代码即可。

$(document).ready(function(){
//init my jPie
   var jPieMenu = $('#promo').pieMenu({icon : [ {   // replace these lines with your existing code
                               path : "path/to/images.png",
                               alt  : "icon",
                               fn   : function(){alert('Click:: icon');return false;}
                          }] });
   $('#promo').hover(function(){ // This ID needs to be the same as your element
      if($('#'+jPieMenu.id).css('display') != 'block') //if jpie is not visible
          jPieMenu.initMenu(200,200);
   })
})

Answer 2

首先，您需要将饼图菜单设置为变量，以便您可以引用其ID：

变化：

jQuery('#promo').pieMenu({icon : [

到

var pieMenu = jQuery('#promo').pieMenu({icon : [

现在我们有一种方法可以引用菜单本身和包含元素#promo，我假设它只是一个div，当盘旋时需要关闭菜单。

无论如何，请添加：

$('#promo').hover(function(){
      if($('#'+pieMenu.id).css('display') != 'block') //if jpie is not visible
          pieMenu.initMenu(200,200);
   })

在最后两组})之间你应该很高兴。

编辑：是的，给你代码的作者错过了一个引用。但是，无论如何，因为您已经对该部分进行了编码。

Answer 3

此外，在第三行的第二个代码块中，在#myelement的开头有一个缺少的引号，这导致该行中的所有其他内容充当字符串

Answer 4

<script type="text/javascript">
        jQuery(document).ready(function(){


            jQuery('#promo').pieMenu({icon : [
                    { 
                        path : "/wp-content/themes/Tersus/images/piemenu/winamp.png",
                        alt  : "Winamp",
                        fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.pls';return false}
                    },  { 
                        path : "/wp-content/themes/Tersus/images/piemenu/vlc.png",
                        alt  : "VLC Media Player",
                        fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.pls';return false}  
                    },{ 
                        path : "/wp-content/themes/Tersus/images/piemenu/QuickTime.png",
                        alt  : "Quick Time Player",
                        fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.qtl';return false}
                    },{ 
                        path : "/wp-content/themes/Tersus/images/piemenu/WMP.png",
                        alt  : "Windows Media Player",
                        fn   : function(){('Click:: Plus');window.location.href = 'http://94.23.250.14:2199/tunein/tranceilfm.asx';return false}
                    },{ 
                        path : "/wp-content/themes/Tersus/images/piemenu/popup.png",
                        alt  : "נגן Popup",
                        fn   : function(){$("#popupplay").click();return false}
                    },{ 
                        path : "/wp-content/themes/Tersus/images/piemenu/iTunes.png",
                        alt  : "iTunes",
                        fn   : function(){alert('...בקרוב');return false}
                    }],
                beforeMenuOpen: function(){
                    jQuery('<div id="shadow"></div>').css(
                    {
                        'position':'fixed',
                        'background-color':'#000000',
                        'opacity': 0.6,
                        'width':'100%',
                        'height':'100%',
                        'z-index' :999,
                        'top':0,
                        'left':0
                    }).appendTo('body');
                },
                beforeMenuClose: function(){
                    jQuery('#shadow').remove();
                }
            });
            jQuery('#promo').hover(function(){ // This ID needs to be the same as your element
                if(!jQuery('#'+jPieMenu.id).is(":visible")) //if jpie is not visible
                    jPieMenu.initMenu(200,200);
            })
        });

    </script>

新手帮助向jQuery添加功能

4 个答案: