• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

LavaLamp.js

The_C

Member
Hallo,
hab auf einer Seite das js Script Lavalamp für das Menü im Einstz das auch soweit gut funktioniert, die Leiste verfolgt die Maus.
Jetz habe ich aber ein Problem das ich selber nicht lösen kann weil mein JS sehr schlecht ist, und zwar...
Wenn ich einen Menüpunkt in meinem CMS System auf "in Menü verbergen" stelle weis die Lavalamp nicht mehr was sie machen soll, weil sie ja den Menüpunkt nicht findet. Das möchte ich gerne so abändern, das wenn kein Menüpunkt gefunden wird die LavaLamp auf den Home Menüpunkt zurückfäht und keine Fehlermeldung in der Console ausgiebt.
Nur wie stell ich das an?
Hie mal der LavaLamp.js Code eventuell hat ja jemend von Euch eine Ahnung wie das funktioniert und kann mir sagen und zeigen wie das geht.
Danke schon mal im Voraus.
HTML:
/**************************************/
/*  LavaLamp Menü
/**************************************/
(function($) {

  $.fn.lavalamp = function(options) {

    options = $.extend({
      speed: 500,
      reset: 0,
      color: 'none',
      radius: 0,
      easing: null
    }, options);

    return this.each(function() {

      var nav = $(this),
        current = nav.children('.active'),
        lavalamp;

      // create the lavalamp item
      nav.children('.lavalamp').remove();
      $('<li class="lavalamp hidden-xs"></li>').css({
        width : current.width(),
        height : nav.height(),
        left : parseInt(current.position().left),
        backgroundColor : options.color,
        borderRadius: options.radius
      }).appendTo(this);

      lavalamp = nav.children('.lavalamp');

      // reusable options
      var opts = {
        duration: options.speed,
        easing: options.easing,
        queue: false
      };

      // trigger the lavalamp on mouseover and mouseleave
      var reset;
      nav.children('li:not(.lavalamp)').hover(function () {
        // mouse over
        clearTimeout(reset);
        lavalamp.animate({
          width: $(this).width(),
          left: $(this).position().left,
        }, opts);
      }, function () {
        // mouse out
        if (window.innerWidth > 768) {
          $(this).trigger('click').children('a').blur();
        }
        reset = setTimeout(function () {
          lavalamp.animate({
            width: current.width(),
            left: current.position().left
          }, opts)
        }, options.reset);
      });

      // zero bottom radius if dropdown is shown
      nav.on('show.bs.dropdown', function() {
        lavalamp.css({
          'border-bottom-left-radius': 0,
          'border-bottom-right-radius': 0
        })
      });

      // reset borser radius if dropdown is hidden
      nav.on('hide.bs.dropdown', function() {
        lavalamp.css({
          'border-radius': options.radius
        })
      });

    }); // end each
    
  };

})(jQuery);
 
Zuletzt bearbeitet von einem Moderator:
Hat hier wirklich keiner eine Ahnung wie das funktioniert?
Hab mir nicht gedacht das es so schwer ist für Euch Profis...
 
oft haben die leute keine zeit, sich umfangreiche testcases zu bauen - dein code schnipsel ist ja in dieser form nicht lauffähig, das müsste der fragende schon selbst übernehmen, z. b. in einem fiddle etc.
 
Code:
	var nav = $(this),
		current = nav.children('.active'),
		lavalamp;
	if (current.length === 0){
		current = nav.children("li:first");
	}
- ungetestet
 
Zurück
Oben