Фоновый рисунок в зависимости от разрешения монитора

воскресенье, 15 ноября 2009

13:04

Фоновый рисунок в зависимости от разрешения монитора

все записи пользователя в сообществе Kevin McLean

A kid from The Ural's

Доброго времени суток!

Идея такова, ява скрипт меняет фоновый рисунок в зависимости от разрешения монитора пользователя

читать дальше

Но почему-то не работает. Помогите пожалуйста

@темы: js

URL

Вы увидели красивую девушку на вечеринке. Подходите к ней... черт.... а вот передо мной лезвие..... порезатЬ?у.... бли... В барах ни одного свободного места, единая разгоряченная ...

Реальная книга 2 дня корейцы приходили в себя и старательно делали вид, ... Ши: У заставила меня ответить на очередной тест. Результа...

Комментарии

15.11.2009 в 18:19

Nuclear Snow

Never Say Never (c)

У тебя в слове sсriрt буква p русская

Еще у тебя два ифа одинковые

  if (navigator.appVersion.indexOf("4.") != -1 && 
      navigator.appName.indexOf("Netscape") != -1) {

Пример рабочего варианта

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Title</title>
</head>

<body>
<sсriрt>
    
    if (typeof(screen) == 'undefined')
    {
        document.write('<body background="bg1.jpg" leftmargin="0" topmargin="0">');
    }else{
        ScrnSize = screen.width + "x" + screen.height;
        switch(ScrnSize) {
            case "800x600":   document.write('<body background="bg0.jpg" leftmargin="0" topmargin="0">');
            case "1024x768":  document.write('<body background="bg1.jpg" leftmargin="0" topmargin="0">');
            case "1152x864":  document.write('<body background="bg2.jpg" leftmargin="0" topmargin="0">');
            case "1280x960":  document.write('<body background="bg3.jpg" leftmargin="0" topmargin="0">');
            case "1280x1024": document.write('<body background="bg4.jpg" leftmargin="0" topmargin="0">');
            case "1600x1200": document.write('<body background="bg5.jpg" leftmargin="0" topmargin="0">');
            case "1600x1280": document.write('<body background="bg6.jpg" leftmargin="0" topmargin="0">');
            case "1680x1050": document.write('<body background="bg7.jpg" leftmargin="0" topmargin="0">');
            default:          document.write('<body background="bg1.jpg" leftmargin="0" topmargin="0">');
        }
    }
    
</sсriрt>
Test-Test-Test
</body>
</html>

URL

15.11.2009 в 22:39

Kevin McLean

A kid from The Ural's

Nuclear Snow

Спасибо

URL

16.11.2009 в 00:35

evoghost

Извините, я не имею ничего против — я просто удивлён способом изменения свойства. А вот так

var theBody = document.getElementsByTagName("body")[0]; // Так, наверное, кроссбраузернее :^)
theBody.background = "bg0.jpg";

не проще? Откровенно говоря, я первый раз сталкиваюсь с таким. Если я просто что-то не знаю, то прошу прощения.

ЗЫ: Можно ещё воспользоваться RegExp для определния версии браузера. Вот так, например:

var bTypes = new Array("msie", "firefox", "safari", "webkit", "opera", "netscape", "konqueror", "gecko");
var pattern = '(' + bTypes.join("|") + ')[\/ ]{1}([0-9\.]+)';
var matchPattern = null;
if(matchPattern = navigator.userAgent.toLowerCase().match(new RegExp(pattern, "g")))
{
	var matchResult = matchPattern[matchPattern.length - 1].match(new RegExp(pattern));
	if(matchResult)
	{
		bType = matchResult[1];
		bVersion = matchResult[2];
	}
}

Мне кажется, так будет интереснее. :^)

URL

19.11.2009 в 22:26

Kevin McLean

A kid from The Ural's

Nuclear Snow

Этот скрипт работает блестяще везде, кроме IE, в IE почему-то полностью по высоте не показывается фоновое изображение

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<title>Title</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">

<link rel="stylesheet" href="school.css">
<body>
<sсriрt type="text/javasсript">
    
    if (typeof(screen) == 'undefined')
    {
        document.write('<body style="margin: 0; padding: 0;background: url(images/bg.jpg);">');
    }else{
        ScrnSize = screen.width + "x" + screen.height;
        switch(ScrnSize) {
            case "800x600":   document.write('<body style="margin: 0; padding: 0;background: url(images/800_600.jpg); height: 600px;">');
            case "1024x600":  document.write('<body style="margin: 0; padding: 0;background: url(images/1024_600.jpg); height: 600px;">');
            case "1024x768":  document.write('<body style="margin: 0; padding: 0;background: url(images/1024_768.jpg); height: 768px;">');
            case "1152x864":  document.write('<body style="margin: 0; padding: 0;background: url(images/1152_864.jpg); height: 864px;">');
            case "1280x768":  document.write('<body style="margin: 0; padding: 0;background: url(images/1280_768.jpg); height: 768px;">');
            case "1280x800":  document.write('<body style="margin: 0; padding: 0;background: url(images/1280_800.jpg); height: 800px;">');
            case "1280x960":  document.write('<body style="margin: 0; padding: 0;background: url(images/1280_960.jpg); height: 960px;">');
            case "1280x1024": document.write('<body style="margin: 0; padding: 0;background: url(images/1280_1024.jpg); height: 1024px;">');
            case "1366x768":  document.write('<body style="margin: 0; padding: 0;background: url(images/1366_768.jpg); height: 768px;">');
            case "1440x900":  document.write('<body style="margin: 0; padding: 0;background: url(images/1440_900.jpg); height: 900px;">');
            case "1600x1200": document.write('<body style="margin: 0; padding: 0;background: url(images/1600_1200.jpg); height: 1200px;">');
            case "1600x1280": document.write('<body style="margin: 0; padding: 0;background: url(images/1600_1280.jpg); height: 1280px;">');
            case "1680x1050": document.write('<body style="margin: 0; padding: 0;background: url(images/1680_1050.jpg); height: 1280px;">');
            case "1920x1080":  document.write('<body style="margin: 0; padding: 0;background: url(images/1920_1080.jpg); height: 1080px;">');
            case "1920x1200":  document.write('<body style="margin: 0; padding: 0;background: url(images/1920_1200.jpg); height: 1200px;">');
            default:          document.write('<body style="margin: 0; padding: 0;background: url(images/bg.jpg);">');
        }
    }
    
</sсriрt>


<div id="header"></div>
<div id="col1">asas</div>
<div id="col2">asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>

asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br>
asas<br></div>
<div id="col3">asas</div>
<div id="footer">
</div>
</body>
</html>

gviragon.ru/test/index3.htm

URL

19.11.2009 в 23:17

Kevin McLean

A kid from The Ural's

Проблема была в doctype
заменил на <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt...">

теперь работает

URL