Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   подгон изображения под размер окна браузера (https://javascript.ru/forum/jquery/11473-podgon-izobrazheniya-pod-razmer-okna-brauzera.html)

рони 19.11.2010 11:22

Kolyaj,
Надо перекрыть всю видимую часть боди при этом чтобы скролинг не увеличился
или проще размер боди с отступами
Пример того что хотелось бы получить в результате
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
<style type="text/css">
img{
  display: none;

}
body{
   margin: 0px;
}
</style>
<script type="text/javascript">
function set()
{  div = document.getElementById('div3');
   div.style.position = "absolute";
   div.style.left = "0px";
   div.style.top  = "0px";
   div.style.width= document.body.offsetWidth+"px";
   div.style.height=document.body.offsetHeight+"px";
   div.style.zIndex=-999;
   div.style.display='block';
}
</script>
</head>
<body>
<img id="div3" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" border="0" alt="" />
<input type="button" name="" value="go"  onclick="set()"/>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
</html>

тоже самое на jquery
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
body{
   margin: 0px;
}
</style>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){ $("#images").width($(document.body).width()).height($(document.body).height()).css({"position": "absolute","left":"0px","top":"0px","margin": "0px"})
  });
</script>
</head>
<body>
<img id="images" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" border="0" alt="" />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
</html>

надо получить тотже самый эффект не используя
<style type="text/css">
body{
   margin: 0px;
}
</style>

плюс если боди меньше вьпорта перекрыть весь вьюпорт

Kolyaj 19.11.2010 11:29

https://github.com/Kolyaj/CrossJS/bl...source/core.js
getDocumentSize

рони 19.11.2010 12:56

Kolyaj,
Благодарю за код по моему вопросу и все остальные скрипты по ссылке

рони 19.11.2010 15:04

Kolyaj,
Собрал всё вместе вот что получилось ))) ещё раз спасибо!!!
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function get(a) {
    var d = document,
        b = d.body,
        e = d.documentElement,
        c = "client" + a;
    a = "scroll" + a;
    return d.compatMode === "CSS1Compat" ? Math.max(e[c], e[a]) : Math.max(b[c], b[a])
};
</script>
</head>
<body>
<input type="button"  value="go"  onclick="alert([get('Width'),get('Height')]);"/>
</body>
</html>


Часовой пояс GMT +3, время: 02:42.