[jQuery] Viewport abfragen funktioniert im IE nicht.

josDesign

Erfahrenes Mitglied
Hallo Gemeinde,

ich möchte ab einer bestimmten Viewport-Höhe im Browser eine CSS-Klasse entfernen.

Das folgende Skript funktioniert überall ausser im IE.

Dies ist mein Code:
Code:
// JavaScript Document

// jQuery's noConflict mode is used instead of the $
var J = jQuery.noConflict();


J(document).ready(function()
{

	//-------------------------------------------------------------------
	// div#top modification
	var viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
	//console.log(viewportHeight);
	if( viewportHeight < 650 ) {
		J('#top').removeClass("normalHeight");
	}
	
});
Wie man sieht, soll die KLasse "normalHeight" von div#top entfernt werden, sofern die Viewporthöhe < 650 Pixel ist.

Hat vielleicht jemand einen Tipp, warum das so im IE nicht funktoiniert?

Mit bestem Dank im Voraus,
jos
 
Vielen DAnk für die Antwort,

Die IF-Abfrage funktioniert für den IE, habs per Alert getestet. Allerdings funktoiniert das jQuery im IE nicht.

Sollte das jQuery nicht problemlos funktionioeren im IE?

HTML:
	// div#top modification
	
	var viewportHeightIE = document.body.clientWidth;
	//console.log(viewportHeight);
	if( navigator.appName=="Microsoft Internet Explorer" ) {
		if( viewportHeightIE < 650 ) {
			J('#top').removeClass('normalHeight');
		}
		
	} else {
		var viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
		if( viewportHeight < 650 ) {
			J('#top').removeClass("normalHeight");
		}
	}
 
Hi,

den einzigen Fehler den ich entdecken kann - du berechnest die Breite anstatt die Höhe.
Code:
var viewportHeightIE = document.body.clientWidth;
Korrekt wäre wohl:
Code:
var viewportHeightIE = document.body.clientHeight;

Ciao
Quaese
 
An dem Thema bin ich auch gerade dran, ich hatte bis dato nur sehr wenig mit JS zu tun und sitze inzwischen schon seit Tagen daran, die Daten (Viewport => Integer) zurück an den Server zu schicken, das ganze habe ich über Jquery bzw. der Ajax-Api gebaut, laut Firebug wird es per Get an den server geschickt, jedoch kommt da nichts an (auch im Apache-Logfile steht das Viewport (bzw. die Höhe in Pixel) mit drin.

Kann mir da jemand ein Tipp geben, wie ich die Daten richtig weiterverarbeiten kann?

So sieht das ganze aus:

Funktion, wo Viewport ausgelesen und verschickt wird:
PHP:
function test ()
{
  ?><?xml version="1.0" encoding="<?php echo __CHARSET; ?>"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
    <head>
        <title>test</title>
        <script type="text/javascript" src="<?php echo __PWC_HOME__; ?>/library/pwc/javascript/jquery.js"></script>
        <script>
        $(document).ready(function()
        {
            h = $(window).height();
            data = {'op': 'test1', 'height': h};
            $.ajax({
                url: 'pwc.test.php',
                type: 'GET',
                data: data
            });
            return false;
        });
     </script>
    </head>
    <body>
        test
    </body>
</html><?php
}

Das ganze wird in der Funktion "test1" abgerufen, dort kommt aber nichts an, obwohl Firebug mir das ausspuckt: http://devel.local/test.php?op=test1&height=520
 

Neue Beiträge

Zurück