Literunner: Lights On/Off Effect

Moinsen,

ich möchte gerne, den Standard Wert von meinem Lights On/Off Effect ändern.
Nur leider bekomme ich es einfach nicht hin.
Standardmässig steht Lights auf Off. Das hätte ich Standardmässig gerne auf On.

Könntet ihr mir dabei helfen?

Hier mein JS Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>  
<script type="text/javascript">  
jQuery.noConflict ();  
(function(){  
var im2 = new Image();  
im2.src = 'images/light_on.png';  
jQuery(function($){  
var w = $(window), dimmer = $('<div style="position:fixed;z-index:-1;top:0;left:0;display:none;background-color:#000;"><\/div'),  
im1 = $('#onoff').toggle(lightsOut, lightsOn).css({zIndex: 11, position: 'relative', cursor: 'pointer'}).attr('src');  
function dresize(){dimmer.css({height: w.height(), width: w.width()});}  
function lightsOut(){this.title = this.alt = 'LICHT AN'; this.src = im2.src; dimmer.stop().css({zIndex: 10}).animate({opacity: 0.85, duration: 'slow'});}  
function lightsOn(){this.title = this.alt = 'LICHT AUS'; this.src = im1; dimmer.stop().css({zIndex: -1}).animate({opacity: 0, duration: 'slow'});}  
dresize();  
$('body').append(dimmer.css({opacity: 0, display: 'block'}));  
w.resize(dresize);  
});  
})();  
</script>

Hier der HTML Code:
<img id="onoff" src="images/light_off.png" alt="LICHT AUS" title="LICHT AUS"><br>

vielen Dank

  1. Om nah hoo pez nyeetz, Literunner!

    Standardmässig steht Lights auf Off. Das hätte ich Standardmässig gerne auf On.

    Könntet ihr mir dabei helfen?

    Hier der HTML Code:

    <img id="onoff" src="images/light_off.png" alt="LICHT AUS" title="LICHT AUS"><br>

    ~~~html
    <img id="onoff" src="images/light_on.png" alt="LICHT AN" title="LICHT AN"><br>  
    
    

    Aber das hast du sicher schon ohne Erfolg probiert?

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Gänse und Gänseblümchen.

    1. <img id="onoff" src="images/light_on.png" alt="LICHT AN" title="LICHT AN"><br>

      
      >   
      > Aber das hast du sicher schon ohne Erfolg probiert?  
        
      Ja, dann wird nur das Bild bzw. Text getauscht.
      
  2. Moin,

    Hier mein JS Code:
    [...]

    Hier der HTML Code:
    [...]

    Ich habe den Code kopiert, den Bildname ausgetauscht, den Bildwechsel deaktiviert, und es funktioniert (Chrome, Firefox, IE9).
    Welchen Browser benutzt du? Was sagt ggf. die Developer-Konsole?

    Grüße Marco

    --
    Ich spreche Spaghetticode - fließend.
    1. Ich habe den Code kopiert, den Bildname ausgetauscht, den Bildwechsel deaktiviert, und es funktioniert (Chrome, Firefox, IE9).
      Welchen Browser benutzt du? Was sagt ggf. die Developer-Konsole?

      Ich benutze den FF.
      Bei deinem Test funktioniert es aber nicht so wie ich es gerne hätte :)
      Ich möchte nicht nur das Bild wechseln, das wäre ja kein Problem.
      sondern: Das wenn die Seite aufgerufen wird. Soll sich der Hintergrund, sofort verdunkel.
      Wenn man dann, auf das Bild klickt, wird es wieder hell.
      Also genau umgekehrt...

      1. Moin,

        Also genau umgekehrt...

        Aha. Na dann häng doch einfach per jQuery das Div unabhängig von irgendeiner Aktion ins DOM und gib ihm eine ID. Dann veränderst du die Logik so, dass der Klick die Sichtbarkeit des Divs toggelt.

        Grüße Marco

        --
        Ich spreche Spaghetticode - fließend.
        1. Aha. Na dann häng doch einfach per jQuery das Div unabhängig von irgendeiner Aktion ins DOM und gib ihm eine ID. Dann veränderst du die Logik so, dass der Klick die Sichtbarkeit des Divs toggelt.

          Das sagst du so einfach :)
          Meine Kenntnisse in JS, liegen bei 5%.
          Das Script was ich verwende ist ein Standard Script. Ich habe da nur die Bilder geändert.
          Hätte nicht gedacht, das es so schwer ist :)

          1. Moin,

            Das sagst du so einfach :)
            Meine Kenntnisse in JS, liegen bei 5%.
            Das Script was ich verwende ist ein Standard Script. Ich habe da nur die Bilder geändert.

            Hm, du solltest das Skript vielleicht trotzdem verstehen ;) Zumindest grob. jQuery ist sehr viel einfacher zu benutzen und zu verstehen, als reines JS.

            Hätte nicht gedacht, das es so schwer ist :)

            Soo schwer ist es auch nicht. Ich hab meinen Test mal so umgebaut, wie du es willst.

            Grüße Marco

            --
            Ich spreche Spaghetticode - fließend.
  3. Ohne auch nur ansatzweise getestet zu haben:

    toggle(lightsOut, lightsOn)

    tauschen gegen

    toggle(lightsOn, lightsOut)

    Könnte klappen.
    Wobei ich die Bezeichung "out" und "on" extrem verwirrend finde.  Im Englischen ist mir "out" für Ausgeschaltet nicht geläufig ...

    1. Ohne auch nur ansatzweise getestet zu haben:

      toggle(lightsOut, lightsOn)

      tauschen gegen

      toggle(lightsOn, lightsOut)

      Könnte klappen.
      Wobei ich die Bezeichung "out" und "on" extrem verwirrend finde.  Im Englischen ist mir "out" für Ausgeschaltet nicht geläufig ...

      Das habe ich auch schon versucht, leider ohne Erfolg.

      1. Om nah hoo pez nyeetz, Literunner!

        Das habe ich auch schon versucht, leider ohne Erfolg.

        Zeig mal bitte die Seite mit funktionierendem aber falsch gepoltem Umschalter, dass man schauen kann, wie die Bilder aussehen und was noch so alles passieren soll.

        Matthias

        --
        Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Vene und Venedig.