ivorysmoker: Jquery - Footer IE Fehler

Hallo zusammen

Ich habe mir eine kleine Funktion zusammengebaut die den Footer steuert. Sprich ist der Scrollbalken ganz unten wird der footer sichtbar.

Dies funktioniert im Firefox, Safari ohne Probleme. Leider tut der Code im IE gar nichts.

Gibt es hier möglicherweise Versionsprobleme?
Hat jemmand eine Idee wie man dies im IE auch zum laufen bekommt?

Die Funktion scrollpos wird über den Evetnhandler onscroll geladen. (Im body)

function scrollpos() {  
			var documentHeight = $(document).height();  
			var scrollDifference = $(window).height() + $(window).scrollTop();  
			if(documentHeight == scrollDifference){  
				$("#Cleiste").css("visibility", "visible");  
			}else{  
				$("#Cleiste").css("visibility", "hidden");  
			}  
		}

<div id="Cleiste" style="visibility:hidden; background-image: url('CLeiste.jpg'); bottom: 0; height: 22px; position: fixed; width: 100%; color:#82888b;">Ich bin ein Footer</div>

Ich bedanke mich für eure Bemühungen.

Grüsse Ivorysmoker

  1. @@ivorysmoker:

    nuqneH

    Dies funktioniert im Firefox, Safari ohne Probleme. Leider tut der Code im IE gar nichts.

    Und wo kann man sich das (Nicht-)Funktionieren ansehen?

    Aus deinem Code ein Testbeispiel erstellen? Danke, keine Lust. Das machst du bitte selber. Codepen, JSFiddle, deine Seite verlinken …

    Qapla'

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    1. Hey Gunnar

      Und wo kann man sich das (Nicht-)Funktionieren ansehen?

      In dem man eine HTML Datei erstellt und die 2-3 sachen reinkopiert.
      Im IE wird es dir im Debugger keine Fehler ausgeben, daher auch die Frage @Versionen.

      Aus deinem Code ein Testbeispiel erstellen? Danke, keine Lust. Das machst du bitte selber. Codepen, JSFiddle, deine Seite verlinken …

      Nachbauen *hust*? HTML Datei erstellen - Code reinkopieren - script & html tags setzen. Voila.

      Das Thema hatten wir schon einmal Gunnar.

      Wer aus meiner Sicht es nicht schaft die paar Zeilen Code in eine HTML Datei zu laden und im Body die funktion zu laden, wird mir wohl auch bei diesem Problem nicht helfen können.

      Grüsse Ivorysmoker

      1. @@ivorysmoker:

        nuqneH

        Nachbauen *hust*? HTML Datei erstellen - Code reinkopieren - script & html tags setzen. Voila.

        Und das soll JEDER tun, der sich mit DEINEM Problem beschäftigt?

        Anstatt dass du das EINMAL tust und ALLE sich das gleich im Browser ansehen können?

        Wer aus meiner Sicht es nicht schaft die paar Zeilen Code in eine HTML Datei zu laden und im Body die funktion zu laden, wird mir wohl auch bei diesem Problem nicht helfen können.

        Wer es nicht schafft, ein Online-Beispiel zu erstellen, um es damit potentiellen Helfern einfach zu machen, wird wohl nicht unbedingt Hilfe erwarten können.

        Qapla'

        --
        „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        1. Hi zusammen

          Dan bin ich ja einmal gespannt ;)

          Footer Test

          Grüss Ivorysmoker

          1. @@ivorysmoker:

            nuqneH

            Dan bin ich ja einmal gespannt ;)
            Footer Test

            IE mag es nicht, dass der Eventhandler für body gesetzt wird. Das onscroll-Attribut beim html-Element und es geht.

            Allerdings sollten Eventhandler gar nicht als on…-Attribute im HTML zu finden sein, sondern im Script gesetzt werden.
            Mit jQuery: $(window).on('scroll', scrollpos);
            oder kurz:  $(window).scroll(scrollpos);

            Ich frag mich allerdings, was das soll. Der Footer ist doch sowieso erst zu sehen, wenn man runterscrollt. Wozu das JavaScript?

            Wie sieht es mit der Barrierefreiheit aus? „Scrollen“ denn Screenreader oder bleibt denen der Footer verborgen?

            Und passt das footer-Element nicht für den Footer und das main-Element nicht für den Hauptinhalt?

            Qapla'

            --
            „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
            1. IE mag es nicht, dass der Eventhandler für body gesetzt wird.

              Anmerkung: ... wobei das Event-Attribut onscroll für <body> seit html5 valide wäre.

            2. Hi Gunnar

              Ich bedanke mich für deinen Lösungsvorschlag.

              IE mag es nicht, dass der Eventhandler für body gesetzt wird. Das onscroll-Attribut beim html-Element und es geht.

              Wiso mag IE das nicht? Bitte um genaue Beschreibung.

              Allerdings sollten Eventhandler gar nicht als on…-Attribute im HTML zu finden sein, sondern im Script gesetzt werden.
              Mit jQuery: $(window).on('scroll', scrollpos);
              oder kurz:  $(window).scroll(scrollpos);

              Funktioniert Prima wen der Eventhandler vom Jquery getriggert wird. Danke

              Ich frag mich allerdings, was das soll. Der Footer ist doch sowieso erst zu sehen, wenn man runterscrollt. Wozu das JavaScript?

              Nicht ganz. Wenn der Balken im float wäre trifft das zu.
              Dieser ist aber Dynamisch und wandert mit der Seite. Siehe CSS
              Jetzt war ein Wunsch das der Footer nur am schluss der Webseite sichtbar wird. Daher die Jquery Erweiterung.

              Wie sieht es mit der Barrierefreiheit aus? „Scrollen“ denn Screenreader oder bleibt denen der Footer verborgen?

              Hmm, dass weis ich momentan noch nicht.

              Und passt das footer-Element nicht für den Footer und das main-Element nicht für den Hauptinhalt?

              Kannst du diese Frage etwas anders vormulieren? Ich verstehe die Frage nicht.

              Gruss Ivorysmoker

              1. @@ivorysmoker:

                nuqneH

                Wiso mag IE das nicht? Bitte um genaue Beschreibung.

                Nun, es ist der IE. ;-) Hätte ich bis zum 9er gesagt. Allerdings geht <body onscroll=> im 10er auch nicht. (11er hab ich nicht getestet.)

                Die Specs durchzuackern, ob das OK so ist oder ein Bug, überlasse ich jetzt mal anderen. Dir z.B.

                Jetzt war ein Wunsch das der Footer nur am schluss der Webseite sichtbar wird.

                Das ist er doch auch, wenn er ganz normal nach dem Hauptinhalt in den Viewport gescrollt wird. Ich verstehe das Problem nicht.

                Und passt das footer-Element nicht für den Footer und das main-Element nicht für den Hauptinhalt?

                Kannst du diese Frage etwas anders vormulieren? Ich verstehe die Frage nicht.

                http://blog.selfhtml.org/2013/03/10/html5-serie-neue-elemente-fuer-die-seitenstruktur/

                Qapla'

                --
                „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                1. Aloha ;)

                  Jetzt war ein Wunsch das der Footer nur am schluss der Webseite sichtbar wird.

                  Das ist er doch auch, wenn er ganz normal nach dem Hauptinhalt in den Viewport gescrollt wird. Ich verstehe das Problem nicht.

                  Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                  Grüße,

                  RIDER

                  --
                  Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
                  ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
                  1. @@Camping_RIDER:

                    nuqneH

                    Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                    position: sticky

                    Demnächst in ihrem Browser.

                    Qapla'

                    --
                    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                    1. Aloha ;)

                      Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                      position: sticky

                      Demnächst in ihrem Browser.

                      I know... Ich warte sehnsüchtig!

                      Grüße,

                      RIDER

                      --
                      Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
                      ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
                      1. Hi Rider

                        Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                        Schon nicht übel aber nicht ganz korrekt. Der Footer befindet sich immer ganz unten unabhängig vom Content. Mit ganz unten ist nicht die unterste scroll Position gemeint sondern die aktuelle Position.

                        Gruss Ivorysmoker

                        1. @@ivorysmoker:

                          nuqneH

                          Schon nicht übel aber nicht ganz korrekt. Der Footer befindet sich immer ganz unten unabhängig vom Content. Mit ganz unten ist nicht die unterste scroll Position gemeint sondern die aktuelle Position.

                          So in etwa? Look Ma, no JavaScript!

                          Qapla'

                          --
                          „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                  2. Om nah hoo pez nyeetz, Camping_RIDER!

                    Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                    bis zu einer ordentlichen Umsetzung von position: sticky hilft http://www.cssstickyfooter.com/de/

                    Matthias

                    --
                    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Liter und Literaturpreis.

                    1. Aloha ;)

                      Ohne Ahnung zu haben erahne ich das Problem: Bei Seiten mit wenig Inhalt steht der Footer irgendwo mitten im Bildschirm, was Layout-Technisch nicht gewünscht ist. Nicht wahr? Das ist ein Mistding, mit dem ich mich auch schon öfter rumgeschlagen habe... Ohne Patentlösung...

                      bis zu einer ordentlichen Umsetzung von position: sticky hilft http://www.cssstickyfooter.com/de/

                      Thank u very much, das sieht doch mal gut aus! Muss ich mir definitiv merken und mal genauer analysieren! Warum hab ich dich eigentlich noch nicht früher dazu befragt? ;)

                      Der TO dürfte damit möglicherweise auch glücklich werden...

                      Grüße,

                      RIDER

                      --
                      Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
                      ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
                      1. Om nah hoo pez nyeetz, Camping_RIDER!

                        Thank u very much, das sieht doch mal gut aus! Muss ich mir definitiv merken und mal genauer analysieren! Warum hab ich dich eigentlich noch nicht früher dazu befragt? ;)

                        Mach das mal. Anpassungen wären sinnvoll. Inzwischen gibts ja HTML5, da kann man für unser Wiki die passenden Elemente verwenden. Px muss für Elementabmessungen auch nicht unbedingt sein und box-sizing existiert.

                        Also, wenn du mal lange Weile hast ;-)

                        Matthias

                        --
                        Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Tal und Talg.

                2. Hi Gunnar

                  Jetzt war ein Wunsch das der Footer nur am schluss der Webseite sichtbar wird.

                  Das ist er doch auch, wenn er ganz normal nach dem Hauptinhalt in den Viewport gescrollt wird. Ich verstehe das Problem nicht.

                  Ich versuche es einmal anders zu erklären:

                  Wie du schon sagst scrollt der Footer immer ganz unten mit, soweit ist deine Ausage auch korrekt.
                  Er ist zwar immer unten aber gehen wir jetzt einmal davon aus das die Seite Ultra viele Content hat. Was wiederum heisst das dieser Footer am Anfang der Seite bereits sichtbar ist und dieser störend ist. Daher habe ich mit dieser Funktion dies unterbunden, da der Footer erst ganz unten auf der Seite sichtbar werden soll.

                  Bestimmt gibs noch etliche Möglichkeiten dies anders zu bauen, da die Seite aber Dynamisch, mehrsprachig etc ist, war dies die einfachste Lösung in meinen Augen.

                  Ich hoffe ich konnte es in etwas schildern.

                  Gruss Ivorysmoker

                  1. Om nah hoo pez nyeetz, ivorysmoker!

                    Jetzt war ein Wunsch das der Footer nur am schluss der Webseite sichtbar wird.
                    Das ist er doch auch, wenn er ganz normal nach dem Hauptinhalt in den Viewport gescrollt wird. Ich verstehe das Problem nicht.

                    Ich versuche es einmal anders zu erklären:

                    Wie du schon sagst scrollt der Footer immer ganz unten mit, soweit ist deine Ausage auch korrekt.
                    Er ist zwar immer unten aber gehen wir jetzt einmal davon aus das die Seite Ultra viele Content hat. Was wiederum heisst das dieser Footer am Anfang der Seite bereits sichtbar ist und dieser störend ist. Daher habe ich mit dieser Funktion dies unterbunden, da der Footer erst ganz unten auf der Seite sichtbar werden soll.

                    Ich hoffe ich konnte es in etwas schildern.

                    leider nein.

                    Wenn der footer sich ganz normal nach dem Hauptinhalt im Markup befindet, ist er nicht sichtbar, wenn der Hauptinhalt nicht in das Browserfenster passt.

                    <body>  
                      <main></main>  
                      <footer></footer>  
                    </body>
                    

                    Matthias

                    --
                    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Wien und Wiener.

            3. Hi,

              Allerdings sollten Eventhandler gar nicht als on…-Attribute im HTML zu finden sein, sondern im Script gesetzt werden.
              Mit jQuery: $(window).on('scroll', scrollpos);

              Und dann noch ein Allerdings:

              Man sollte nicht auf *jeden* Scroll-Event mit ggf. aufwendigen Operationen reagieren – siehe http://ejohn.org/blog/learning-from-twitter/

              MfG ChrisB

              --
              Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/
              1. @@ChrisB:

                nuqneH

                Und dann noch ein Allerdings:

                Man sollte nicht auf *jeden* Scroll-Event mit ggf. aufwendigen Operationen reagieren – siehe http://ejohn.org/blog/learning-from-twitter/

                Natürlich nicht. Deshalb stellte ich auch das ganze Script infrage.

                Qapla'

                --
                „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        2. Anstatt dass du das EINMAL tust und ALLE sich das gleich im Browser ansehen können?

          Gutes Argument, ich habe euch den Link hinterlegt.

          Footer IE Fehler

          Grüsse Ivorysmoker

      2. Hallo,

        Nachbauen *hust*? HTML Datei erstellen - Code reinkopieren - script & html tags setzen. Voila.

        @ivorysmoker: siehste eigentlich ganz einfach, das solltest du auch schaffen...

        Gruß
        Kalk