Контент в блоке

[fro]

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

<div class="content"></div>;

.content{background:#FFFFFF;position:absolute;height:100%;width:980px;top:0;right:0;bottom:0;left:0;margin:0 auto;}

Edited June 5, 2015 by fro

[afdw]

Не советую так делать. Нужен заголовок, шапка, футер.

UPD: советую сделать один элемент и центрировать его, а потом вложить туда блоки, а не центрировать каждый.

[fro]

ок, уже сделал, ну это пока пробная версия, потом доделаю до ума =)

[afdw]

Вот примерно такой нужен скрипт:

var $news = document.querySelector(".news");var loaded = 0;function load(){  var xmlhttp = new XMLHttpRequest();  xmlhttp.open("GET", "/news?start=" + loaded, true);  xmlhttp.onreadystatechange = function()  {    if (xmlhttp.readyState == 4)    {       if(xmlhttp.status == 200)       {         var news = JSON.parse(xmlhttp.responseText).news;         news.forEach(function(newObject)         {           var $new = document.createElement("div");           var $title = document.createElement("h2");           $title.innerText = newObject["new_title"];           $new.appendChild($title);           var $text = document.createElement("div");           $text.innerHTML = newObject["new_text"];           $new.appendChild($text);           var $date = document.createElement("span");           $date.innerText = newObject["new_date"];           $new.appendChild($date);           $news.appendChild($new);         });       }    }  };  xmlhttp.send(null);}document.onload = load;

Edited June 11, 2015 by afdw

[fro]

его просто вставить в блок и добавить <?php?> ?

[afdw]

его просто вставить в блок и добавить <?php?> ?

Нет. тогда нельзя будет подгружать новости при скроле. Сделайте, как я написал, исправляя ошибки.

[fro]

что то он ругается на 2 строчку var loaded = 0; вроде бы там должно быть load но и так пишет ошибку T_VAR

[afdw]

что то он ругается на 2 строчку var loaded = 0; вроде бы там должно быть load но и так пишет ошибку T_VAR

Это JavaScript, а не PHP

[fro]

ну до меня уже дошло =) сейчас буду ошибки исправлять

[afdw]

ну до меня уже дошло =) сейчас буду ошибки исправлять

Залейте, скажу, что исправить.

[fro]

создал фаил под именем news.js и подключил на главную страницу, что то не понял как он работает

[afdw]

Вы криво залили. И да, сделайте автоматические отступы, а то код невозможно читать.

UPD: Вот сделал сам.

[fro]

это я исправил, а вот насчет коряво, разве js подключается не таким кодом 

<script src="news.js"></script>;

потому что другого я просто не помню и в нете поискал не нашел 

[afdw]

";" зачем?

А коряво вы скопировали сам файл. Его содержание я дал ссылкой выше.

[fro]

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

Edited June 11, 2015 by fro

[afdw]

Тьфу, вот правильная последняя строка:

window.onload = load;

И замените название папки "post" на "news".

И замените первую строку на:

var $news;

А после 4 допишите:

$news = document.querySelector(".news")

А после

$news.appendChild($new);

допишите:

loaded += 10;

Edited June 11, 2015 by afdw

[fro]

ок заменил, теперь как я понимаю нужно научить скрипт загружать посты ?

[afdw]

ок заменил, теперь как я понимаю нужно научить скрипт загружать посты ?

Он уже научился Сделайте остальные правки, которые я дописал.

[fro]

дописал =) 

[afdw]

Уберите строки:

height: 9950px;height: 10000px;

И допишите после

                                 loaded += 10;                             });

это:

var $clearfix = document.createElement("div");$clearfix.style.clear = "both";$news.appendChild($clearfix);

[fro]

все сделал, но видимо коряво 

[afdw]

Отмените последнее изменение и удалите строку

top: 50px;

[fro]

var $clearfix = document.createElement("div"); $clearfix.style.clear = "both"; $news.appendChild($clearfix);

 

вот это удалил и топ тоже 

[afdw]

Допишите в конец:

document.body.onscroll = function(){  if(document.body.scrollTop >= document.body.scrollHeight - 500)  {    load();  }}

[fro]

дописал =) 

[afdw]

Уберите:

$news = document.querySelector(".news")

Замените

window.onload = load;document.body.onscroll = function(){  if(document.body.scrollTop >= document.body.scrollHeight - 500)  {    load();  }}

На:

window.onload = function(){  $news = document.querySelector(".news");  document.body.onscroll = function()  {    if(document.body.scrollTop >= document.body.scrollHeight - 500)    {      load();    }  }};

Переместите

loaded += 10;

На строку ниже.

UPD:

Замените

window.onload = function(){  $news = document.querySelector(".news");  document.body.onscroll = function()  {    if(document.body.scrollTop >= document.body.scrollHeight - 500)    {      load();    }  }};

на

window.onload = function(){  $news = document.querySelector(".news");  load();  document.body.onscroll = function()  {    if(document.body.scrollTop >= document.body.scrollHeight - 500)    {      load();    }  }};