JavaScript umożliwia programiście w niezwykle prosty sposób uzyskać wiele informacji dotyczących monitora, przeglądarki oraz położenia kursora użytkownika.

Java Script - obiekt window i położenie kursora

Poniżej przedstawiłem w pierwszej kolejności właściwości MouseEvent, a dalej właściwości window dotyczące monitora, przeglądarki. Na samym dole znajduje się kod użyty do wyświetlenia na stronie poniższych informacji.

Zwróć uwagę, że wszystkie informacje wypisane po pogrubionych nazwach dotyczą Twojej przeglądarki i przypisywane, są dynamicznie za pomocą Java Script.

Aktualne położenie kursora:
Informacje o dotyczące monitora i przeglądarki.
Aktualny rozmiar okna przeglądarki (bez uwzględnienia toolbarów i scrollbarów):
Aktualny rozmiar okna przeglądarki (włącznie z toolbarami i scrollbarami):
Aktualne przesunięcie okna scrollbarami (przy ich braku wskazanie będzie 0):
Wskazuje o ile oddalona jest lewa i górna krawędź przeglądarki od lewej i górnej części ekranu:
Aktualny link z okna przeglądarki oraz liczba elementów, które znajduje się w historii:

Poniżej kod Java Script do wywołania wszystkich zaprezentowanych informacji.

W pierwszym akapicie, są zbierane do tablicy wszystkie elementy DIV, do których wprowadzone będą dane. Drugi akapit to wywołanie funkcji za każdym razem gdy zmieniany jest rozmiar okna lub następuje ruch myszką. Ostatni akapit to aktualizacja pobranych danych dotyczących okna przeglądarki i myszy.

var pt = [];
for (var i=1; i<18; i++) {
	pt[i] = document.getElementById("p"+String(i));

}

window.addEventListener('mousemove', position, false);
window.addEventListener('resize', position, false);
position();

function position(event) {
	pt[1].innerHTML = "window.innerHeight: " + window.innerHeight;
	pt[2].innerHTML = "window.innerWidth: " + window.innerWidth;
	pt[3].innerHTML = "window.outerWidth: " + window.outerWidth;
	pt[4].innerHTML = "window.outerHeight: " + window.outerHeight;
	pt[5].innerHTML = "window.pageXOffset: " + window.pageXOffset;
	pt[6].innerHTML = "window.pageYOffset: " + window.pageYOffset;
	pt[7].innerHTML = "window.screenX: " + window.screenX;
	pt[8].innerHTML = "window.screenY: " + window.screenY;
	pt[9].innerHTML = "window.location: " + window.location;
	pt[11].innerHTML = "window.history.length: " + window.history.length;
	pt[12].innerHTML = "event.screenX: " + event.screenX;
	pt[13].innerHTML = "event.screenY: " + event.screenY;
	pt[14].innerHTML = "event.pageX: " + event.pageX;
	pt[15].innerHTML = "event.pageY: " + event.pageY;
	pt[16].innerHTML = "event.clientX: " + event.clientX;
	pt[17].innerHTML = "event.clientY: " + event.clientY;
}

Kontynuując przeglądanie strony, wyrażasz zgodę na używanie przez nas plików cookies. dowiedz się więcej

Aby zapewnić Tobie najwyższy poziom realizacji usługi, opcje ciasteczek na tej stronie są ustawione na "zezwalaj na pliki cookies". Kontynuując przeglądanie strony bez zmiany ustawień lub klikając przycisk "Akceptuję" zgadzasz się na ich wykorzystanie.

Zamknij