[JS] bg zależne od rozdzielczości ekranu

[Zado1984]

Czy istnieje jakiś skrypt umożliwiający automatyczną zmianę tła strony zależnie od rozdzielczości ekranu? Nigdzie nie mogę znaleźc takiego cuda, jedyne co znalazłem w necie to skrypt, który wyświetla całą stronę zależnie od rozdzielczości ekranu, może pomoże:
<script language="javascript" type="text/javascript"><!--
// Autor: Volkov
var Wide = screen.width;
if (Wide <= 640) window.location = "index640.html";
else if (Wide <= 800) window.location = "index800.html";
else if (Wide <= 1024) window.location = "index1024.html";
else window.location = "index1152.html";
//--></script>

[gorylek]

No ogólnie zasada jest ta sama tylko kod wymaga pewnej modyfikacji:

Kod: Zaznacz cały

<script language="javascript" type="text/javascript"><!--
var Wide = screen.width;
if (Wide <= 640) document.body.background = "bg640.jpg";
else if (Wide <= 800) document.body.background = "bg800.jpg";
else if (Wide <= 1024) document.body.background = "bg1024.jpg";
else document.body.background = "bg.jpg";
//--></script>

Pisane z palca ale chyba nie zrobiłem jakiegoś poważnego byka więc powinno chodzić. W zależności od rozdzielczości zastosuje jeden z podanych obrazków. Nazwy obrazków są dowolne.

[Zado1984]

super, działa elegancko, dzięki gorylek. może już wymyślam, ale można zmodyfikowac ten kod żeby rozpoznawał jednocześnie szerokośc i wysokośc ekranu? Miałoby to sens, gdy chciałbym przygotowac tło osobno dla monitorów WXGA i SXGA, np. 1280x800 i 1280x1024 albo innych jak: 1600x1200 i 1600x1024

[gorylek]

Nie ma najmniejszego problemu.

Tutaj masz kilka parametrów które mogą się przydać:
1. screen.Height - wysokość ekranu
2. screen.Width - szerokość ekranu
3. screen.availHeight - robocza wysokość ekranu, zwraca wartość okna bez części statycznych jak pasek startu, toolbary itp jak mniemam
4. screen.availWidth - robocza szerokość ekranu, zwraca wartość okna bez części statycznych jak boczne toolbary itp jak mniemam
5. screen.colorDepth - zwraca paletę kolorów, np 4 (16 kolorów), 8 (256 kolorów) 16 (65,536 kolorów, tzw. High Color). 24 (16,777,216 kolorów, tzw. True Color)

[Zado1984]

Dzięki za podpowiedź, skleciłem kod, wygląda następująco i działa w 100%, sprawdziłem:

Kod: Zaznacz cały

<script language="javascript" type="text/javascript">
<!--
var W = screen.width;
var H = screen.height;
if (W == 800 && H == 600) document.body.background = "800x600.jpg";
else if (W == 1024 && H == 768) document.body.background = "1024x768.jpg";
else if (W == 1280 && H == 800) document.body.background = "1280x800.jpg";
else if (W == 1280 && H == 1024) document.body.background = "1280x1024.jpg";
else if (W == 1600 && H == 1024) document.body.background = "1600x1024.jpg";
else if (W == 1600 && H == 1200) document.body.background = "1600x1200.jpg";
else document.body.background = "bg.jpg";
//-->
</script>

[stormfly]

Chciałbym dodać mały OT, że takich rzeczy się nie robi na profesjonalnych stronach. Powinno tak się przygotować stronę by działała dobrze pod każdą rozdzielczością od xxx wzwyż bez manipulacji w javascript.

[Zado1984]

no racja, ale jeśli tłem jest np.jakiś widok, twarz czy cokolwiek co w innej rozdzielczości niż oryginalna wyglądałoby nieestetycznie czy poprostu byłoby ucięte z prawej czy dołu, to chyba można użyc js