Сайт с прокруткой страниц вниз

@AreeeS · Регистрация: 26.04.2015

Author24 — интернет-сервис помощи студентам

Делаю сайт с прокруткой вниз.
Как сделать так, что бы при заходе на сайт длина и ширина 1 страници сайта фиксировалась под максимальное окно браузера. И дальше уже была статична.

@СтаниславТ · 26.04.2015, 23:25

чтобы фиксировалась, ээ она итак при максимальном окне браузера фиксируется максимально. если же Вам нужен обратный эффект при маленьком окне копайте в сторону глобального объекта window и его атрибутов.

@AreeeS · 26.04.2015, 23:31 **[ТС]**

Т.е мне надо что бы размер сайта т.е его контент подстраивался под максимальное окно браузера. А когда браузер изменяют в размере появлялись полосы прокрути.
Если делать в % то он будет резиновым. Если задавать в px то на разных мониторах будет выглядеть по разному и заходить за окно.

Добавлено через 17 секунд
В сайте используется 100% пространства.

@СтаниславТ · 26.04.2015, 23:40

То, что Вам нужно является стандартной и встроенной моделью взаимодейсвия с окном браузера. Эта модель реализована во всех необходимых браузерах - стандартно. Но можно приспособить окно и прокрутку под свои нужды, как и любой элемент в программировании. но в данном случае - это обычно не используется.

Добавлено через 1 минуту
И всё таки спрошу - под Окно или Контент?

@AreeeS · 27.04.2015, 00:02 **[ТС]**

Т.е у одного пользователя экран 1960x1080 у второго 1600x900.
На сайте страница задана размерами у меня 1955x955 и при прокрутки вниз идут другие странници.

У второго появятся полосу прокрутки, чего мне не нужно.
Как сделать так, что бы этих полос у второго не было а было изображение оптимизировано?

@СтаниславТ · 27.04.2015, 00:18

это называется адаптивная вёрстка. ни окно, а то, что я назвал контентом. по поводу окна, то - это глобальный объект javascript, и он отвечает именно за окно и изменения окна и отображения контента !В ОКНАХ. - такая просто вещь - например такое окно такого размера отображает так или по другому. правильное расположение контена зависит от вёртски html/css.
Проще говоря сначало надо сверстать при помощи html/css, а эта нелегко, затем можно внести изменения в само окно и запрограммировать с его помощью контент, (глобальный объект здесь - окно) которому относится прокрутка, расположения элементов, но только относительно окна.
до освоения вёрстки на html и css, за javascript не советую браться, т.к. он дополняет сайт.

@AreeeS · 27.04.2015, 00:20 **[ТС]**

С версткой хорошо разобрался. В данный момент перехожу на яву. Вот сижу думаю как его адаптировать под разные размеры экрана.

@СтаниславТ · 27.04.2015, 00:23

Может Вы не поймёте о чём я пишу, если Вы не программист. Одно могу сказать точно, то, что Вам нужно - это вёрстка html/css.

Добавлено через 2 минуты
AreeeS, это относится к всё к той же вёрстке и различиям браузерам. Необходимо ещё освоить минимальный размер экрана и максимальный и прописать им значения - но это задачи вёртски.

@AreeeS · 27.04.2015, 00:25 **[ТС]**

У меня сайт заполнен на 100 % и не свободного пространства. Прописывая @media нет сымсла. Так как мне надо динамичное изменение и только на размер окна. А потом статичное положение.
Т.е скрипт должен определить размер окна и под него подогнать сайт.
Идеи есть но мб есть уже готовые скрипты?

@СтаниславТ · 27.04.2015, 00:32

Ещё раз - размер окна или разрешение монитора?

Добавлено через 1 минуту
Т.е. на измение в размере окна нужно сделать событие?

@AreeeS · 27.04.2015, 00:33 **[ТС]**

Если брать размер окна, то при открытий сайта окно может быть раскрыто и значения занесутся с текущего окна.
А зная разрешения монитора можно с небольшой погрешностью вычислить максимальный размер окна и подогнать под него сайт, что бы в дальнейшем сайт бы 1 размера и не был резиновым при скручивания окна.

@СтаниславТ · 27.04.2015, 00:43

хо-хо-хо javascript не реализует передачи данных через окно в целях безопасности. у них это строго.

@AreeeS · 27.04.2015, 00:46 **[ТС]**

width=document.body.clientWidth; // ширина
height=document.body.clientHeight; // высота
Мне надо что бы эти параметры единожды передавались в css, изменяли 1 раз всю верстку. Т.е по алгоритму меняли все значения. И сайт становился статичным, а не резиновым.
Т.е параметры под каждый монитор подгонялись автоматически.

@СтаниславТ · 27.04.2015, 00:52

во всех браузерах сайты все будут выглядеть иначе из-за специфики браузеров. а разрешения монитора - это всё вёрстка и в нём важную роль играет минимальный и максимальный размер - это под мониторы. элементы html/css тоже должны быть совместимы со всеми основными брузерами.

Добавлено через 4 минуты
запомните - у вас нет доступа у чужим компьютерам через js, работайте на браузеры.

@arcmag · 27.04.2015, 10:17

Вот скрипт, при загрузке страницы проверит размеры окна и и присвоит их блоку с классом page

PHP/HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
<style>
*{box-sizing:border-box; -box-sizing:border-box; margin:0px; padding:0px;}
.page{border:solid 1px black; margin:0px auto;}
</style>
<script>
window.addEventListener("load",function(){
    var page = document.getElementsByClassName("page")[0];
    page.style.width = window.innerWidth+"px";
    page.style.height = window.innerHeight+"px";
});
</script>
</head>
<body>
    <div class="page"></div>
</body>
</html>

@Sraimon · 27.04.2015, 18:29

Сообщение от AreeeS

Делаю сайт с прокруткой вниз.
Как сделать так, что бы при заходе на сайт длина и ширина 1 страници сайта фиксировалась под максимальное окно браузера. И дальше уже была статична.

в css

CSS

@media only screen and (min-width: 0px){  //если на экране есть 0 px =) 
//телефон
}
@media only screen and (min-width: 421px){  //если экран больше 421 px 
// телефон перевернут на бок или планшет
}
@media only screen and (min-width: 741px){ //если экран больше 741px
// планшет перевернут на бок
}
@media only screen and (min-width: 769px){ // и т.д
// и т.д
}
@media only screen and (min-width: 1025px){ // и т.д
// и т.д
}
@media only screen and (min-width: 1281px){ // и т.д
// и т.д
}

Тут прописываете разные css стили для разных устройств
А вообщем поищите в сторону media запросов

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	27.04.2015, 00:33 [ТС]	11
	Если брать размер окна, то при открытий сайта окно может быть раскрыто и значения занесутся с текущего окна. А зная разрешения монитора можно с небольшой погрешностью вычислить максимальный размер окна и подогнать под него сайт, что бы в дальнейшем сайт бы 1 размера и не был резиновым при скручивания окна. 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	27.04.2015, 00:46 [ТС]	13
	width=document.body.clientWidth; // ширина height=document.body.clientHeight; // высота Мне надо что бы эти параметры единожды передавались в css, изменяли 1 раз всю верстку. Т.е по алгоритму меняли все значения. И сайт становился статичным, а не резиновым. Т.е параметры под каждый монитор подгонялись автоматически. 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	27.04.2015, 00:52	14
	во всех браузерах сайты все будут выглядеть иначе из-за специфики браузеров. а разрешения монитора - это всё вёрстка и в нём важную роль играет минимальный и максимальный размер - это под мониторы. элементы html/css тоже должны быть совместимы со всеми основными брузерами. Добавлено через 4 минуты запомните - у вас нет доступа у чужим компьютерам через js, работайте на браузеры. 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
		1
	Сайт с прокруткой страниц вниз 26.04.2015, 22:56. Показов 2374. Ответов 15 Метки нет (Все метки) Делаю сайт с прокруткой вниз. Как сделать так, что бы при заходе на сайт длина и ширина 1 страници сайта фиксировалась под максимальное окно браузера. И дальше уже была статична. 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	26.04.2015, 23:25	2
	чтобы фиксировалась, ээ она итак при максимальном окне браузера фиксируется максимально. если же Вам нужен обратный эффект при маленьком окне копайте в сторону глобального объекта window и его атрибутов. 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	26.04.2015, 23:31 [ТС]	3
	Т.е мне надо что бы размер сайта т.е его контент подстраивался под максимальное окно браузера. А когда браузер изменяют в размере появлялись полосы прокрути. Если делать в % то он будет резиновым. Если задавать в px то на разных мониторах будет выглядеть по разному и заходить за окно. Добавлено через 17 секунд В сайте используется 100% пространства. 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	26.04.2015, 23:40	4
	То, что Вам нужно является стандартной и встроенной моделью взаимодейсвия с окном браузера. Эта модель реализована во всех необходимых браузерах - стандартно. Но можно приспособить окно и прокрутку под свои нужды, как и любой элемент в программировании. но в данном случае - это обычно не используется. Добавлено через 1 минуту И всё таки спрошу - под Окно или Контент? 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	27.04.2015, 00:02 [ТС]	5
	Т.е у одного пользователя экран 1960x1080 у второго 1600x900. На сайте страница задана размерами у меня 1955x955 и при прокрутки вниз идут другие странници. У второго появятся полосу прокрутки, чего мне не нужно. Как сделать так, что бы этих полос у второго не было а было изображение оптимизировано? 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	27.04.2015, 00:18	6
	это называется адаптивная вёрстка. ни окно, а то, что я назвал контентом. по поводу окна, то - это глобальный объект javascript, и он отвечает именно за окно и изменения окна и отображения контента !В ОКНАХ. - такая просто вещь - например такое окно такого размера отображает так или по другому. правильное расположение контена зависит от вёртски html/css. Проще говоря сначало надо сверстать при помощи html/css, а эта нелегко, затем можно внести изменения в само окно и запрограммировать с его помощью контент, (глобальный объект здесь - окно) которому относится прокрутка, расположения элементов, но только относительно окна. до освоения вёрстки на html и css, за javascript не советую браться, т.к. он дополняет сайт. 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	27.04.2015, 00:20 [ТС]	7
	С версткой хорошо разобрался. В данный момент перехожу на яву. Вот сижу думаю как его адаптировать под разные размеры экрана. 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	27.04.2015, 00:23	8
	Может Вы не поймёте о чём я пишу, если Вы не программист. Одно могу сказать точно, то, что Вам нужно - это вёрстка html/css. Добавлено через 2 минуты AreeeS, это относится к всё к той же вёрстке и различиям браузерам. Необходимо ещё освоить минимальный размер экрана и максимальный и прописать им значения - но это задачи вёртски. 0

@AreeeS 0 / 0 / 0 Регистрация: 26.04.2015 Сообщений: 26
	27.04.2015, 00:25 [ТС]	9
	У меня сайт заполнен на 100 % и не свободного пространства. Прописывая @media нет сымсла. Так как мне надо динамичное изменение и только на размер окна. А потом статичное положение. Т.е скрипт должен определить размер окна и под него подогнать сайт. Идеи есть но мб есть уже готовые скрипты? 0

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	27.04.2015, 00:32	10
	Ещё раз - размер окна или разрешение монитора? Добавлено через 1 минуту Т.е. на измение в размере окна нужно сделать событие? 0

	27.04.2015, 18:29

@СтаниславТ 5 / 5 / 0 Регистрация: 23.04.2015 Сообщений: 57
	27.04.2015, 00:43	12
	хо-хо-хо javascript не реализует передачи данных через окно в целях безопасности. у них это строго. 0