Rotieren unterbrechen bei onmouseover

Einklappen
X
 
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
  • BSendes

    #1

    Rotieren unterbrechen bei onmouseover

    Hallo!

    Ich habe heute mal versucht den Imageslider so zu modifizieren, dass die Rotation unterbrochen wird, sobald man mit der Maus über das angezeigte Bild fährt und weitergeht, sobald man das Bild wieder verlässt.

    Allerdings stellte sich das doch deutlich schwerer raus als gedacht, da ich die passenden Methoden nicht aufrufen konnte, weil man nicht auf die passende Variable zugreifen kann.

    Hat da einer von Euch eine Idee oder vielleicht sogar schonmal das Problem selbst gehabt und gelöst?

    Grüsse
    Benjamin
  • kmrohe
    Contao-Nutzer
    • 22.01.2011
    • 41

    #2
    Eine kleine Anregung: Falls es keine bessere Lösung gibt (so genau habe ich mir den Code jetzt nicht angesehen) sollte es gehen, wenn du das Javascript modifizierst. Dazu hängst Du einen weiteren Event-Handler an den Image-Slider, der bei der Aktion mouseover die bereits bestehende Methode "stop" und bei mouseout "start" aufruft (siehe Buttons).

    Etwas in der Art: V1.addEvent('mouseover',V1.stop.bind(V1));
    V1.addEvent('mouseout',V1.play.bind(V1,[false]));

    Der Image-Slider arbeitet anscheinend mit eigenen IDs ('1' in diesm Fall), achte bei Deinen Versuchen darauf. Wo genau der Event-Handler angehängt werden muß (ich habe der Einfachheit halber V1 benutzt) mußt Du ausprobieren. Wo die einzelnen Scripte liegen (ausser in plugins/imageslider) und der js-Ausgabecode erzeugt wird, weiß ich nicht.

    Viel Erfolg,
    Kostja

    Kommentar

    • datashop
      Contao-Nutzer
      • 25.02.2011
      • 6

      #3
      imageslider bei mouseover stoppen

      ich hab das wie folgt gelöst:

      die Datei "system/modules/imageslider/ContentImageslider.php" öffnen. Suchen nach der Zeile 116:
      $autoplay = "V" . $objSettings->id . ".play(true);";
      und nach dieser Zeile folgenden Code einfügen, speichern, fertig
      PHP-Code:
          $controls =    "$('elements" . $objSettings->id . "').addEvent('mouseout',V" . $objSettings->id . ".play.bind(V" . $objSettings->id . ",[false]));
      $('elements" . $objSettings->id . "').addEvent('mouseover',V" . $objSettings->id . ".stop.bind(V" . $objSettings->id . "));";
          $addControls = true;
          $this->Template->controls = true;
          $this->Template->control = $control; 
      
      Nun stopt die Rotation beim Überfahren der Bilder und startet wieder nach dem Verlassen mit dem Mauszeiger.

      Die Lösung ist zwar nicht ganz sauber, denn durch ein Update der Erweiterung kann es durchaus sein daß der Code überschrieben wird. Aber dennoch ein verwendbare Lösung denk ich.

      Kommentar

      • BSendes

        #4
        @datashop:

        Super!
        Vielen Dank, das funktioniert genau so, wie ich es haben will!

        Kommentar

        • Tastaturberuf
          Contao-Nutzer
          • 14.03.2011
          • 199

          #5
          Hallo Datashop,

          leider funktioniert es bei mir nicht. Das Javascript verändert sich auch nicht und sieht nach wie vor genau so aus:

          Code:
          window.addEvent('domready',function()
          {
          //is-js-start
          	var V1 = new viewer( $$('#elements1 img)' ),
          	{
          		sizes: {w:960,h:200},
          		mode: 'rand',
          		modes: ['alpha'],
          		fxOptions:{ duration: 1000  },
          		interval: 10000
          	});
          	V1.playRandom();$('prev1').addEvent('click',V1.previous.bind(V1));
          $('next1').addEvent('click',V1.next.bind(V1));;
          //is-js-end
          Ich benutze die Version 1.1.0 stable Build 33. Vielleicht kann mir jemand weiterhelfen?

          Vielen Dank.
          Tastaturberuf | Code with ♥ and Contao.

          Kommentar

          • datashop
            Contao-Nutzer
            • 25.02.2011
            • 6

            #6
            Hallo Cord

            Das liegt denk ich daran daß du bei der Bildrotation die Buttons aktiviert hast.
            Versuche bei den Einstellungen des entsprechenden ImageSlider beim Punkt "Button" den Haken bei "Buttons aktivieren" rauszunehmen.

            Meine Lösung welche ich oben angegeben habe ist nur für einen Slider ohne Play/Stop bzw Prev/Next Button vorgesehen.

            Kommentar

            Lädt...