PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
CMS, Shopsoftware & Forensysteme
WordPress
Nav wird auf der Startseite doppelt dargestellt
Beitrag
<blockquote data-quote="goecken" data-source="post: 2738803" data-attributes="member: 154088"><p>Hallo zusammen, Ich habe lokal ein Wordpress theme erstellt. Da habe ich eine Nav mit diesen Code von ajlkn eingefügt:</p><p></p><p>[CODE]/* jquery.dropotron.js v1.4.3 | (c) @ajlkn | github.com/ajlkn/jquery.dropotron | MIT licensed */</p><p></p><p>(function ($) {</p><p></p><p> // Disables selection.</p><p> $.fn.disableSelection_dropotron = function () {</p><p> return $(this).css('user-select', 'none').css('-khtml-user-select', 'none').css('-moz-user-select', 'none').css('-o-user-select', 'none').css('-webkit-user-select', 'none');</p><p> }</p><p></p><p> // Dropotron prototype method.</p><p> $.fn.dropotron = function (options) {</p><p></p><p> if (this.length == 0)</p><p> return $(this);</p><p></p><p> if (this.length > 1)</p><p> for (var i = 0; i < this.length; i++)</p><p> $(this[i]).dropotron(options);</p><p></p><p> return $.dropotron($.extend({</p><p> selectorParent: $(this)</p><p> }, options));</p><p></p><p> }</p><p></p><p> // Dropotron method.</p><p> $.dropotron = function (options) {</p><p></p><p> // Settings.</p><p> var settings = $.extend({</p><p></p><p> // Parent jQuery object.</p><p> selectorParent: null,</p><p></p><p> // Base Z-Index.</p><p> baseZIndex: 1000,</p><p></p><p> // Menu class (assigned to every <ul>).</p><p> menuClass: 'dropotron',</p><p></p><p> // Expansion mode ("hover" or "click").</p><p> expandMode: 'hover',</p><p></p><p> // Hover delay (in ms).</p><p> hoverDelay: 150,</p><p></p><p> // Hide delay (in ms; 0 disables).</p><p> hideDelay: 250,</p><p></p><p> // Opener class.</p><p> openerClass: 'opener',</p><p></p><p> // Active opener class.</p><p> openerActiveClass: 'active',</p><p></p><p> // Submenu class prefix.</p><p> submenuClassPrefix: 'level-',</p><p></p><p> // Menu mode ("instant", "fade", "slide", "zoom").</p><p> mode: 'fade',</p><p></p><p> // Menu speed ("fast", "slow", or ms).</p><p> speed: 'fast',</p><p></p><p> // Easing mode ("swing", "linear").</p><p> easing: 'swing',</p><p></p><p> // Alignment ("left", "center", "right").</p><p> alignment: 'left',</p><p></p><p> // Submenu offset X.</p><p> offsetX: 0,</p><p></p><p> // Submenu offset Y.</p><p> offsetY: 0,</p><p></p><p> // Global offset Y.</p><p> globalOffsetY: 0,</p><p></p><p> // IE Offset X.</p><p> IEOffsetX: 0,</p><p></p><p> // IE Offset Y.</p><p> IEOffsetY: 0,</p><p></p><p> // If true and mode = "fade", prevents top-level opener fade.</p><p> noOpenerFade: true,</p><p></p><p> // Detach second level menus (prevents parent style bleed).</p><p> detach: true,</p><p></p><p> // If true and detach = true, leave original menu intact.</p><p> cloneOnDetach: true</p><p></p><p> }, options);</p><p></p><p> // Vars.</p><p> var $top = settings.selectorParent,</p><p> $menus = $top.find('ul'),</p><p> $body = $('body'),</p><p> $bodyhtml = $('body,html'),</p><p> $window = $(window);</p><p></p><p> var isLocked = false,</p><p> hoverTimeoutId = null,</p><p> hideTimeoutId = null;</p><p></p><p> // Main.</p><p></p><p> // Top.</p><p> $top</p><p> .on('doCollapseAll', function () {</p><p> $menus.trigger('doCollapse');</p><p> });</p><p></p><p> // Top level menus.</p><p> $menus.each(function () {</p><p></p><p> var $menu = $(this),</p><p> $opener = $menu.parent();</p><p></p><p> // If a hideDelay is set, set up the event.</p><p> if (settings.hideDelay > 0)</p><p> $menu.add($opener)</p><p> .on('mouseleave', function (e) {</p><p> window.clearTimeout(hideTimeoutId);</p><p> hideTimeoutId = window.setTimeout(function () {</p><p> $menu.trigger('doCollapse');</p><p> }, settings.hideDelay);</p><p> });</p><p></p><p> // Menu.</p><p> $menu</p><p> .disableSelection_dropotron()</p><p> .hide()</p><p> .addClass(settings.menuClass)</p><p> .css('position', 'absolute')</p><p> .on('mouseenter', function (e) {</p><p> window.clearTimeout(hideTimeoutId);</p><p> })</p><p> .on('doExpand', function () {</p><p></p><p> // Already visible? Bail out.</p><p> if ($menu.is(':visible'))</p><p> return false;</p><p></p><p> // Reset our "hide" timeout.</p><p> window.clearTimeout(hideTimeoutId);</p><p></p><p> // Collapse everything but this menu.</p><p> $menus.each(function () {</p><p></p><p> var $this = $(this);</p><p></p><p> if (!$.contains($this.get(0), $opener.get(0)))</p><p> $this.trigger('doCollapse');</p><p></p><p> });</p><p></p><p> // Vars.</p><p> var oo = $opener.offset(),</p><p> op = $opener.position(),</p><p> opp = $opener.parent().position(),</p><p> ow = $opener.outerWidth(),</p><p> mw = $menu.outerWidth(),</p><p> isTL = ($menu.css('z-index') == settings.baseZIndex);</p><p></p><p> var x, c, left, top;</p><p></p><p> // If this is a top level menu ...</p><p> if (isTL) {</p><p></p><p> // If detach is enabled, use .position()</p><p> if (!settings.detach)</p><p> x = op;</p><p> // Otherwise, use .offset()</p><p> else</p><p> x = oo;</p><p></p><p> top = x.top + $opener.outerHeight() + settings.globalOffsetY;</p><p> c = settings.alignment;</p><p></p><p> // Remove alignment classes.</p><p> $menu</p><p> .removeClass('left')</p><p> .removeClass('right')</p><p> .removeClass('center');</p><p></p><p> // Figure out alignment and position.</p><p> switch (settings.alignment) {</p><p></p><p> case 'right':</p><p> left = x.left - mw + ow;</p><p></p><p> if (left < 0) {</p><p></p><p> left = x.left;</p><p> c = 'left';</p><p></p><p> }</p><p></p><p> break;</p><p></p><p> case 'center':</p><p> left = x.left - Math.floor((mw - ow) / 2);</p><p></p><p> if (left < 0) {</p><p></p><p> left = x.left;</p><p> c = 'left';</p><p></p><p> } else if (left + mw > $window.width()) {</p><p></p><p> left = x.left - mw + ow;</p><p> c = 'right';</p><p></p><p> }</p><p></p><p> break;</p><p></p><p> case 'left':</p><p> default:</p><p> left = x.left;</p><p></p><p> if (left + mw > $window.width()) {</p><p></p><p> left = x.left - mw + ow;</p><p> c = 'right';</p><p></p><p> }</p><p></p><p> break;</p><p></p><p> }</p><p></p><p> // Add alignment class.</p><p> $menu.addClass(c);</p><p></p><p> }</p><p></p><p> // Otherwise, we're dealing with a submenu.</p><p> else {</p><p></p><p> // If the opener position isn't static ...</p><p> if ($opener.css('position') == 'relative'</p><p> || $opener.css('position') == 'absolute') {</p><p></p><p> top = settings.offsetY;</p><p> left = (-1 * op.left);</p><p></p><p> } else {</p><p></p><p> top = op.top + settings.offsetY;</p><p> left = 0;</p><p></p><p> }</p><p></p><p> // Figure out position (based on alignment).</p><p> switch (settings.alignment) {</p><p></p><p> case 'right':</p><p> left += (-1 * $opener.parent().outerWidth()) + settings.offsetX;</p><p></p><p> break;</p><p></p><p> case 'center':</p><p> case 'left':</p><p> default:</p><p> left += $opener.parent().outerWidth() + settings.offsetX;</p><p></p><p> break;</p><p></p><p> }</p><p></p><p> }</p><p></p><p> // Legacy IE? Apply IE-specific offsets.</p><p> if (navigator.userAgent.match(/MSIE ([0-9]+)\./) && RegExp.$1 < 8) {</p><p></p><p> left += settings.IEOffsetX;</p><p> top += settings.IEOffsetY;</p><p></p><p> }</p><p></p><p> // Position and show the menu.</p><p> $menu</p><p> .css('left', left + 'px')</p><p> .css('top', top + 'px')</p><p> .css('opacity', '0.01')</p><p> .show();</p><p></p><p> // Kludge!</p><p> var tmp = false;</p><p></p><p> // Non-static position fix.</p><p> if ($opener.css('position') == 'relative'</p><p> || $opener.css('position') == 'absolute')</p><p> left = (-1 * op.left);</p><p> else</p><p> left = 0;</p><p></p><p> if ($menu.offset().left < 0) {</p><p></p><p> left += $opener.parent().outerWidth() - settings.offsetX;</p><p> tmp = true;</p><p></p><p> } else if ($menu.offset().left + mw > $window.width()) {</p><p></p><p> left += (-1 * $opener.parent().outerWidth()) - settings.offsetX;</p><p> tmp = true;</p><p></p><p> }</p><p></p><p> if (tmp)</p><p> $menu</p><p> .css('left', left + 'px');</p><p></p><p> $menu</p><p> .hide()</p><p> .css('opacity', '1');</p><p></p><p> // Figure out animation mode.</p><p> switch (settings.mode) {</p><p></p><p> case 'zoom':</p><p></p><p> isLocked = true;</p><p></p><p> $opener.addClass(settings.openerActiveClass);</p><p> $menu.animate({</p><p> width: 'toggle',</p><p> height: 'toggle'</p><p> }, settings.speed, settings.easing, function () {</p><p> isLocked = false;</p><p> });</p><p></p><p> break;</p><p></p><p></p><p> case 'slide':</p><p></p><p> isLocked = true;</p><p></p><p> $opener.addClass(settings.openerActiveClass);</p><p> $menu.animate({</p><p> height: 'toggle'</p><p> }, settings.speed, settings.easing, function () {</p><p> isLocked = false;</p><p> });</p><p></p><p> break;</p><p></p><p> case 'fade':</p><p></p><p> isLocked = true;</p><p></p><p> if (isTL && !settings.noOpenerFade) {</p><p></p><p> var tmp;</p><p></p><p> if (settings.speed == 'slow')</p><p> tmp = 80;</p><p> else if (settings.speed == 'fast')</p><p> tmp = 40;</p><p> else</p><p> tmp = Math.floor(settings.speed / 2);</p><p></p><p> $opener.fadeTo(tmp, 0.01, function () {</p><p> $opener.addClass(settings.openerActiveClass);</p><p> $opener.fadeTo(settings.speed, 1);</p><p> $menu.fadeIn(settings.speed, function () {</p><p> isLocked = false;</p><p> });</p><p> });</p><p></p><p> } else {</p><p></p><p> $opener.addClass(settings.openerActiveClass);</p><p> $opener.fadeTo(settings.speed, 1);</p><p> $menu.fadeIn(settings.speed, function () {</p><p> isLocked = false;</p><p> });</p><p></p><p> }</p><p></p><p> break;</p><p></p><p> case 'instant':</p><p> default:</p><p></p><p> $opener.addClass(settings.openerActiveClass);</p><p> $menu.show();</p><p></p><p> break;</p><p></p><p> }</p><p></p><p> return false;</p><p> })</p><p> .on('doCollapse', function () {</p><p></p><p> // Not visible? Bail out.</p><p> if (!$menu.is(':visible'))</p><p> return false;</p><p></p><p> // Collapse the menu.</p><p> $menu.hide();</p><p> $opener.removeClass(settings.openerActiveClass);</p><p> $menu.find('.' + settings.openerActiveClass).removeClass(settings.openerActiveClass);</p><p> $menu.find('ul').hide();</p><p></p><p> return false;</p><p></p><p> })</p><p> .on('doToggle', function (e) {</p><p></p><p> if ($menu.is(':visible'))</p><p> $menu.trigger('doCollapse');</p><p> else</p><p> $menu.trigger('doExpand');</p><p></p><p> return false;</p><p></p><p> });</p><p></p><p> // Menu's opener.</p><p> $opener</p><p> .disableSelection_dropotron()</p><p> .addClass('opener')</p><p> .css('cursor', 'pointer')</p><p> .on('click touchend', function (e) {</p><p></p><p> // Locked? Bail.</p><p> if (isLocked)</p><p> return;</p><p></p><p> // Toggle menu.</p><p> e.preventDefault();</p><p> e.stopPropagation();</p><p> $menu.trigger('doToggle');</p><p></p><p> });</p><p></p><p> // If expandMode is "hover", set up the event.</p><p> if (settings.expandMode == 'hover')</p><p> $opener.hover(function (e) {</p><p></p><p> if (isLocked)</p><p> return;</p><p></p><p> hoverTimeoutId = window.setTimeout(function () {</p><p> $menu.trigger('doExpand');</p><p> }, settings.hoverDelay);</p><p></p><p> },</p><p> function (e) {</p><p></p><p> window.clearTimeout(hoverTimeoutId);</p><p></p><p> });</p><p></p><p> });</p><p></p><p> // All links.</p><p> $menus.find('a')</p><p> .css('display', 'block')</p><p> .on('click touchend', function (e) {</p><p></p><p> // Locked? Bail.</p><p> if (isLocked)</p><p> return;</p><p></p><p> // No href? Prevent default.</p><p> if ($(this).attr('href').length < 1)</p><p> e.preventDefault();</p><p></p><p> });</p><p></p><p> // All list items.</p><p> $top.find('li')</p><p> .css('white-space', 'nowrap')</p><p> .each(function () {</p><p></p><p> var $this = $(this),</p><p> $a = $this.children('a'),</p><p> $ul = $this.children('ul'),</p><p> href = $a.attr('href');</p><p></p><p> // If href is blank ("") or a hash (#), prevent the link from doing anything.</p><p> $a.on('click touchend', function (e) {</p><p></p><p> if (href.length == 0</p><p> || href == '#')</p><p> e.preventDefault();</p><p> else</p><p> e.stopPropagation();</p><p></p><p> });</p><p></p><p> // If there is a link but no unordered list ...</p><p> if ($a.length > 0 && $ul.length == 0)</p><p> $this.on('click touchend', function (e) {</p><p></p><p> if (isLocked)</p><p> return;</p><p></p><p> $top.trigger('doCollapseAll');</p><p></p><p> e.stopPropagation();</p><p></p><p> });</p><p></p><p> });</p><p></p><p> // Top level list items.</p><p> $top.children('li').each(function () {</p><p></p><p> var $opener = $(this),</p><p> $menu = $opener.children('ul'),</p><p> c;</p><p></p><p> if ($menu.length > 0) {</p><p></p><p> // If we're using detach ...</p><p> if (settings.detach) {</p><p></p><p> // If we're cloning on detach ...</p><p> if (settings.cloneOnDetach) {</p><p></p><p> // Make a copy of the menu.</p><p> c = $menu.clone();</p><p></p><p> // Leave it behind</p><p> c</p><p> .attr('class', '')</p><p> .hide()</p><p> .appendTo($menu.parent());</p><p></p><p> }</p><p></p><p> // Detach the menu and move it to the end of the <body> element.</p><p> $menu</p><p> .detach()</p><p> .appendTo($body);</p><p></p><p> }</p><p></p><p> // Step through menus, assigning z-indexes and submenu class prefixes as necessary.</p><p> for (var z = settings.baseZIndex, i = 1, y = $menu; y.length > 0; i++) {</p><p></p><p> y.css('z-index', z++);</p><p></p><p> if (settings.submenuClassPrefix)</p><p> y.addClass(settings.submenuClassPrefix + (z - 1 - settings.baseZIndex));</p><p></p><p> y = y.find('> li > ul');</p><p></p><p> }</p><p></p><p> }</p><p></p><p> });</p><p></p><p> // Window.</p><p> $window</p><p> .on('scroll', function () {</p><p> $top.trigger('doCollapseAll');</p><p> })</p><p> .on('keypress', function (e) {</p><p></p><p> // Collapse all menus if the user hits escape.</p><p> if (!isLocked && e.keyCode == 27) {</p><p></p><p> e.preventDefault();</p><p> $top.trigger('doCollapseAll');</p><p></p><p> }</p><p></p><p> });</p><p></p><p> // Body.</p><p> $bodyhtml</p><p> .on('click touchend', function () {</p><p></p><p> if (!isLocked)</p><p> $top.trigger('doCollapseAll');</p><p></p><p> });</p><p></p><p> };</p><p></p><p>})(jQuery);</p><p></p><p>var foo = $('#main-nav > ul');</p><p>foo.dropotron();</p><p>[/CODE]</p><p></p><p>Das klappt hervorragend bis auf eine Sache: Auf der Startseite wird das mobile Menü doppelt angezeigt. Also wenn ich das eine Panel ausblende befindet sich dahinter das nächste. Welches sich wieder ausblenden lässt. Meine Vermutung war, dass sowohl auf die index.php als auch auf die page.php zugegriffen wird und somit doppelt erscheint. Selbst wenn ich den nav Part nur in die page.php integriere bleibt das Problem bestehen. Hatte vielleicht jemand schon mal ein ähnliches Problem? Vielen Dank für eure Hilfe. Liebe Grüße</p></blockquote><p></p>
[QUOTE="goecken, post: 2738803, member: 154088"] Hallo zusammen, Ich habe lokal ein Wordpress theme erstellt. Da habe ich eine Nav mit diesen Code von ajlkn eingefügt: [CODE]/* jquery.dropotron.js v1.4.3 | (c) @ajlkn | github.com/ajlkn/jquery.dropotron | MIT licensed */ (function ($) { // Disables selection. $.fn.disableSelection_dropotron = function () { return $(this).css('user-select', 'none').css('-khtml-user-select', 'none').css('-moz-user-select', 'none').css('-o-user-select', 'none').css('-webkit-user-select', 'none'); } // Dropotron prototype method. $.fn.dropotron = function (options) { if (this.length == 0) return $(this); if (this.length > 1) for (var i = 0; i < this.length; i++) $(this[i]).dropotron(options); return $.dropotron($.extend({ selectorParent: $(this) }, options)); } // Dropotron method. $.dropotron = function (options) { // Settings. var settings = $.extend({ // Parent jQuery object. selectorParent: null, // Base Z-Index. baseZIndex: 1000, // Menu class (assigned to every <ul>). menuClass: 'dropotron', // Expansion mode ("hover" or "click"). expandMode: 'hover', // Hover delay (in ms). hoverDelay: 150, // Hide delay (in ms; 0 disables). hideDelay: 250, // Opener class. openerClass: 'opener', // Active opener class. openerActiveClass: 'active', // Submenu class prefix. submenuClassPrefix: 'level-', // Menu mode ("instant", "fade", "slide", "zoom"). mode: 'fade', // Menu speed ("fast", "slow", or ms). speed: 'fast', // Easing mode ("swing", "linear"). easing: 'swing', // Alignment ("left", "center", "right"). alignment: 'left', // Submenu offset X. offsetX: 0, // Submenu offset Y. offsetY: 0, // Global offset Y. globalOffsetY: 0, // IE Offset X. IEOffsetX: 0, // IE Offset Y. IEOffsetY: 0, // If true and mode = "fade", prevents top-level opener fade. noOpenerFade: true, // Detach second level menus (prevents parent style bleed). detach: true, // If true and detach = true, leave original menu intact. cloneOnDetach: true }, options); // Vars. var $top = settings.selectorParent, $menus = $top.find('ul'), $body = $('body'), $bodyhtml = $('body,html'), $window = $(window); var isLocked = false, hoverTimeoutId = null, hideTimeoutId = null; // Main. // Top. $top .on('doCollapseAll', function () { $menus.trigger('doCollapse'); }); // Top level menus. $menus.each(function () { var $menu = $(this), $opener = $menu.parent(); // If a hideDelay is set, set up the event. if (settings.hideDelay > 0) $menu.add($opener) .on('mouseleave', function (e) { window.clearTimeout(hideTimeoutId); hideTimeoutId = window.setTimeout(function () { $menu.trigger('doCollapse'); }, settings.hideDelay); }); // Menu. $menu .disableSelection_dropotron() .hide() .addClass(settings.menuClass) .css('position', 'absolute') .on('mouseenter', function (e) { window.clearTimeout(hideTimeoutId); }) .on('doExpand', function () { // Already visible? Bail out. if ($menu.is(':visible')) return false; // Reset our "hide" timeout. window.clearTimeout(hideTimeoutId); // Collapse everything but this menu. $menus.each(function () { var $this = $(this); if (!$.contains($this.get(0), $opener.get(0))) $this.trigger('doCollapse'); }); // Vars. var oo = $opener.offset(), op = $opener.position(), opp = $opener.parent().position(), ow = $opener.outerWidth(), mw = $menu.outerWidth(), isTL = ($menu.css('z-index') == settings.baseZIndex); var x, c, left, top; // If this is a top level menu ... if (isTL) { // If detach is enabled, use .position() if (!settings.detach) x = op; // Otherwise, use .offset() else x = oo; top = x.top + $opener.outerHeight() + settings.globalOffsetY; c = settings.alignment; // Remove alignment classes. $menu .removeClass('left') .removeClass('right') .removeClass('center'); // Figure out alignment and position. switch (settings.alignment) { case 'right': left = x.left - mw + ow; if (left < 0) { left = x.left; c = 'left'; } break; case 'center': left = x.left - Math.floor((mw - ow) / 2); if (left < 0) { left = x.left; c = 'left'; } else if (left + mw > $window.width()) { left = x.left - mw + ow; c = 'right'; } break; case 'left': default: left = x.left; if (left + mw > $window.width()) { left = x.left - mw + ow; c = 'right'; } break; } // Add alignment class. $menu.addClass(c); } // Otherwise, we're dealing with a submenu. else { // If the opener position isn't static ... if ($opener.css('position') == 'relative' || $opener.css('position') == 'absolute') { top = settings.offsetY; left = (-1 * op.left); } else { top = op.top + settings.offsetY; left = 0; } // Figure out position (based on alignment). switch (settings.alignment) { case 'right': left += (-1 * $opener.parent().outerWidth()) + settings.offsetX; break; case 'center': case 'left': default: left += $opener.parent().outerWidth() + settings.offsetX; break; } } // Legacy IE? Apply IE-specific offsets. if (navigator.userAgent.match(/MSIE ([0-9]+)\./) && RegExp.$1 < 8) { left += settings.IEOffsetX; top += settings.IEOffsetY; } // Position and show the menu. $menu .css('left', left + 'px') .css('top', top + 'px') .css('opacity', '0.01') .show(); // Kludge! var tmp = false; // Non-static position fix. if ($opener.css('position') == 'relative' || $opener.css('position') == 'absolute') left = (-1 * op.left); else left = 0; if ($menu.offset().left < 0) { left += $opener.parent().outerWidth() - settings.offsetX; tmp = true; } else if ($menu.offset().left + mw > $window.width()) { left += (-1 * $opener.parent().outerWidth()) - settings.offsetX; tmp = true; } if (tmp) $menu .css('left', left + 'px'); $menu .hide() .css('opacity', '1'); // Figure out animation mode. switch (settings.mode) { case 'zoom': isLocked = true; $opener.addClass(settings.openerActiveClass); $menu.animate({ width: 'toggle', height: 'toggle' }, settings.speed, settings.easing, function () { isLocked = false; }); break; case 'slide': isLocked = true; $opener.addClass(settings.openerActiveClass); $menu.animate({ height: 'toggle' }, settings.speed, settings.easing, function () { isLocked = false; }); break; case 'fade': isLocked = true; if (isTL && !settings.noOpenerFade) { var tmp; if (settings.speed == 'slow') tmp = 80; else if (settings.speed == 'fast') tmp = 40; else tmp = Math.floor(settings.speed / 2); $opener.fadeTo(tmp, 0.01, function () { $opener.addClass(settings.openerActiveClass); $opener.fadeTo(settings.speed, 1); $menu.fadeIn(settings.speed, function () { isLocked = false; }); }); } else { $opener.addClass(settings.openerActiveClass); $opener.fadeTo(settings.speed, 1); $menu.fadeIn(settings.speed, function () { isLocked = false; }); } break; case 'instant': default: $opener.addClass(settings.openerActiveClass); $menu.show(); break; } return false; }) .on('doCollapse', function () { // Not visible? Bail out. if (!$menu.is(':visible')) return false; // Collapse the menu. $menu.hide(); $opener.removeClass(settings.openerActiveClass); $menu.find('.' + settings.openerActiveClass).removeClass(settings.openerActiveClass); $menu.find('ul').hide(); return false; }) .on('doToggle', function (e) { if ($menu.is(':visible')) $menu.trigger('doCollapse'); else $menu.trigger('doExpand'); return false; }); // Menu's opener. $opener .disableSelection_dropotron() .addClass('opener') .css('cursor', 'pointer') .on('click touchend', function (e) { // Locked? Bail. if (isLocked) return; // Toggle menu. e.preventDefault(); e.stopPropagation(); $menu.trigger('doToggle'); }); // If expandMode is "hover", set up the event. if (settings.expandMode == 'hover') $opener.hover(function (e) { if (isLocked) return; hoverTimeoutId = window.setTimeout(function () { $menu.trigger('doExpand'); }, settings.hoverDelay); }, function (e) { window.clearTimeout(hoverTimeoutId); }); }); // All links. $menus.find('a') .css('display', 'block') .on('click touchend', function (e) { // Locked? Bail. if (isLocked) return; // No href? Prevent default. if ($(this).attr('href').length < 1) e.preventDefault(); }); // All list items. $top.find('li') .css('white-space', 'nowrap') .each(function () { var $this = $(this), $a = $this.children('a'), $ul = $this.children('ul'), href = $a.attr('href'); // If href is blank ("") or a hash (#), prevent the link from doing anything. $a.on('click touchend', function (e) { if (href.length == 0 || href == '#') e.preventDefault(); else e.stopPropagation(); }); // If there is a link but no unordered list ... if ($a.length > 0 && $ul.length == 0) $this.on('click touchend', function (e) { if (isLocked) return; $top.trigger('doCollapseAll'); e.stopPropagation(); }); }); // Top level list items. $top.children('li').each(function () { var $opener = $(this), $menu = $opener.children('ul'), c; if ($menu.length > 0) { // If we're using detach ... if (settings.detach) { // If we're cloning on detach ... if (settings.cloneOnDetach) { // Make a copy of the menu. c = $menu.clone(); // Leave it behind c .attr('class', '') .hide() .appendTo($menu.parent()); } // Detach the menu and move it to the end of the <body> element. $menu .detach() .appendTo($body); } // Step through menus, assigning z-indexes and submenu class prefixes as necessary. for (var z = settings.baseZIndex, i = 1, y = $menu; y.length > 0; i++) { y.css('z-index', z++); if (settings.submenuClassPrefix) y.addClass(settings.submenuClassPrefix + (z - 1 - settings.baseZIndex)); y = y.find('> li > ul'); } } }); // Window. $window .on('scroll', function () { $top.trigger('doCollapseAll'); }) .on('keypress', function (e) { // Collapse all menus if the user hits escape. if (!isLocked && e.keyCode == 27) { e.preventDefault(); $top.trigger('doCollapseAll'); } }); // Body. $bodyhtml .on('click touchend', function () { if (!isLocked) $top.trigger('doCollapseAll'); }); }; })(jQuery); var foo = $('#main-nav > ul'); foo.dropotron(); [/CODE] Das klappt hervorragend bis auf eine Sache: Auf der Startseite wird das mobile Menü doppelt angezeigt. Also wenn ich das eine Panel ausblende befindet sich dahinter das nächste. Welches sich wieder ausblenden lässt. Meine Vermutung war, dass sowohl auf die index.php als auch auf die page.php zugegriffen wird und somit doppelt erscheint. Selbst wenn ich den nav Part nur in die page.php integriere bleibt das Problem bestehen. Hatte vielleicht jemand schon mal ein ähnliches Problem? Vielen Dank für eure Hilfe. Liebe Grüße [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
CMS, Shopsoftware & Forensysteme
WordPress
Nav wird auf der Startseite doppelt dargestellt
Oben