0
Codeflavorsフローティングメニューをインストールしてインストールしました。問題はマウスでマウスを移動するまで「閉じたまま」（少し黒い矢印のように見えます）のままです。私はそれが開いたままにして、常に最初の層のリンクを表示したい。あなたがしたい場合は、左側の小さな黒い矢印であるvitasino.comでそれを見ることができます。CSSを編集してWordPressのフローティングメニューを開いたままにする
編集：
/**
* @author: CodeFlavors [www.codeflavors.com]
* @version: 1.0.1
* @framework: jQuery
*/
(function($){
$(document).ready(function(){
if (typeof CFM_MENU_PARAMS == 'undefined') {
if(typeof console !== 'undefined'){
console.log('CodeFlavors floating menu warning: Floating menu params not defined. Script stopped.');
}
return;
}
var menu = $('#cfn_floating_menu').find('ul').first(),
items = menu.children('li'),
options = $.parseJSON(CFM_MENU_PARAMS);
$('#cfn_floating_menu').css({'top':options.top_distance});
if(1 == options.animate){
$(window).scroll(function(e){
var st = $(window).scrollTop();
if(st > options.top_distance + 20){
$('#cfn_floating_menu').animate({'top':st+options.top_distance},{'queue':false, 'duration':500});
}else{
$('#cfn_floating_menu').animate({'top':options.top_distance},{'queue':false, 'duration':500});
}
});
}
// show submenus
$(menu).find('li').mouseenter(function(){
$(this).children('ul').show(100);
}).mouseleave(function(){
$(this).children('ul').hide(200);
}).each(function(i, e){
// for menus having children, add class has-children
var submenu = $(e).children('ul.sub-menu');
if(submenu.length > 0){
$(this).addClass('has-children');
}
});
// highlight current item from menu
$(menu).find('li.current-menu-item').children('a').addClass('currentItem');
// if first item is the trigger, show the menu only when hovering that item
if($(items[0]).attr('id') == 'cfm_menu_title_li'){
var main = items.splice(0,1),
menuWidth = menu.width();
$(main).find('a').click(function(e){
e.preventDefault();
})
$(items).hide();
$(menu).mouseenter(function(){
$(items).show(100);
$(main).animate({'width':menuWidth}, 100).removeClass('closed');
$(menu).css('width', menuWidth);
}).mouseleave(function(){
$(items).hide(200);
$(main).css('width', 'auto').addClass('closed');
$(menu).css('width', 'auto');
})
}
})
})(jQuery);
これはdeisgnのドキュメンテーションがどのように見えるかですが、私は何を変更する必要があります。 jqueryのについてのコメントを受け取った後、ここにcfm_menu.jsの情報がありますか？
1/**
2 * MENU DESIGN - do all design changes below
3 */
4
5/**
6 * Menu container
7 */
8#cfn_floating_menu ul{
9 -moz-box-shadow:2px 2px 2px #CCC;
10 -webkit-box-shadow:2px 2px 2px #CCC;
11 box-shadow:2px -1px 4px #CCC;
12}
13 /**
14 * Menu anchor container
15 */
16 #cfn_floating_menu ul li{
17 font-size:12px;
18 border-bottom:1px #2B2B2B solid;
19 }
20 /**
21 * Menu anchor
22 */
23 #cfn_floating_menu ul li a{
24 background:#000;
25 color:#FFF;
26 text-decoration:none;
27 }
28 /**
29 * Hovered and active anchor design
30 */
31 #cfn_floating_menu ul li a:HOVER,
32 #cfn_floating_menu ul li a.currentItem{
33 color:#FFF;
34 background:#999;
35 }
私の知識によれば、これを行うには 'JQuery'を使う必要があります。 CSSを使ってこれを行うのはかなり難しいです。 –
.jsファイルに情報を追加しました。おそらくそれは役に立ちます – NoobWebdesigner