Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.08.2013, 17:34
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

расположение текста для SEO
Всем привет!

У меня такая задача, нужно текст расположить в начале кода, т.е. сразу под открывающимся тегом бади, а на экран выводить в конце контента, но перед футером. Контент по высоте резиновый. Я сделала это с помощью position'a. Только это работает при фиксированном тексте, для которого я сделала зазор по высоте между футером и контентом. А у меня должен текст быть динамичным, т.е. на разных страницах объем текста меняется.

Подскажите, как сделать так, чтобы этот зазор для текста, расположенный между основным контентом и футером менялся по высоте вслед за текстом?

Вот как у этого сайта,если прокрутите вниз там текст начинается с"Как производится доставка",а если пройтись по другим пунктам меню, то текста либо нету, либо другой текст:http://http://enjoyflowers.ru/dostavka_buketov/

Последний раз редактировалось Nailya, 28.08.2013 в 17:41.
Ответить с цитированием
  #2 (permalink)  
Старый 28.08.2013, 17:45
Аватар для jsru_
Кандидат Javascript-наук
Отправить личное сообщение для jsru_ Посмотреть профиль Найти все сообщения от jsru_
 
Регистрация: 09.04.2013
Сообщений: 149

что если дать высоту текста - 5%, а размер блока - 7%?

можно измерить высоту текста и исходя из этого задать высоту зазора. но, думаю, тут можно обойтись css
Ответить с цитированием
  #3 (permalink)  
Старый 03.09.2013, 15:05
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

мне кажется не то(
Дело в том, что мне нужно, чтобы текст был расположен внутри <div id="content"></div>. Внутри этого дива есть свое содержимое, за которым и должен идти этот текст,но текст у меня прибит к низу с помощью position'a и bottom:0;
Т.е. содержимое налазит на текст, а при малом содержимом, текст не следует за ним, оставаясь внизу
Для наглядности, вот ссылка:http://s020.radikal.ru/i720/1309/1a/f15edda43bff.png
http://s020.radikal.ru/i719/1309/21/143a557d7f20.png

вот код
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
	<link rel="stylesheet" href="temp.css" type="text/css"> 
	
 </head>
	<body>
		<div id="container">
		<div id="main">
			<div id="all">
				<div id="key_words">текст, который должен быть внизу<br>текст, который должен быть внизу<br>текст, который должен быть внизу<br>текст, который должен быть внизу
			</div>
					<div id="sidebar">sidebar</div>
					<div id="content">
					content<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>
					text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>
					text<br>
					end
					</div>
				</div><!--end all-->
			</div><!--end main-->	
				<div id="footer">footer</div>
		</div><!--end container--> 	
  </body>                   
 </html>



html,body{
	background:#fff;
	height:100%;
	color:#000;
	margin:0;
	padding:0;
}
#container{
	width:1200px;
	height:100%;
	background:url(bg_sidebar.png) repeat-y;
	margin:0 auto;
	
}	
#key_words{
	position:absolute;
	margin-left:250px;
	color:red;
	bottom:0;
}
#all{
	width:100%;
	overflow:hidden;
	background:url(bg_sidebar.png) repeat-y;
}

#main{
	min-height:100%;
	background:url(bg_content.png) repeat-y 100% 0;
	position:relative;
}	
#sidebar{
	float:left;
	width:250px;
}
#content{
	float:left;
	width:950px;
}
#footer{
	float:left;
	width:100%;
	height:150px;
	background:#388b3d;
Ответить с цитированием
  #4 (permalink)  
Старый 03.09.2013, 15:22
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

position:relative у меня в #main

вы наверно имеете в виду как на этой странице сделатьhttp://jsfiddle.net/VkuaL/
Ответить с цитированием
  #5 (permalink)  
Старый 03.09.2013, 15:36
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Судя по тому, что Вы написали на js-форуме, Вам нужно скриптовое решение? Вот:
<div id="container">
	<div id="key_words"></div>
	<div id="main">
		<div id="all">
			<div id="sidebar">sidebar</div>
			<div id="content"></div>
		</div>
	</div>
	<div id="clone"></div>
	<div id="footer">footer</div>
</div>

var srcDiv = document.getElementById('key_words');
var cloneDiv = document.getElementById('clone');
cloneDiv.innerHTML = srcDiv.innerHTML;
srcDiv.style.display = 'none';
Ответить с цитированием
  #6 (permalink)  
Старый 03.09.2013, 15:41
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Сообщение от Nailya Посмотреть сообщение
position:relative у меня в #main

вы наверно имеете в виду как на этой странице сделатьhttp://jsfiddle.net/VkuaL/
да. Можно и так. Вынесите блок из main и добавьте в него футер
Семантически это конечно неправильно, но Вы ведь уже пренебрегаете семантикой по условиям задачи.

Последний раз редактировалось BETEPAH, 03.09.2013 в 15:55.
Ответить с цитированием
  #7 (permalink)  
Старый 03.09.2013, 16:02
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

во втором варианте: если я добавлю футер в блок main, то при малом контенте футер поднимается вверх, а текст на экране расположен вне блока и не следует за текстом, который внутри блока с id="content"
Ответить с цитированием
  #8 (permalink)  
Старый 03.09.2013, 16:18
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

мне нужно, чтобы было как на этом скриншоте, чтобы текст для сео(обозначен красным цветом) шел сразу за текстом что в id="content", объем текста в обоих случаях меняется,но и чтобы не заезжал на футер
http://s017.radikal.ru/i430/1309/54/b839947844e0.png
Ответить с цитированием
  #9 (permalink)  
Старый 04.09.2013, 06:59
Аватар для Nailya
Кандидат Javascript-наук
Отправить личное сообщение для Nailya Посмотреть профиль Найти все сообщения от Nailya
 
Регистрация: 05.04.2013
Сообщений: 135

Господа! Неужели нет выхода из этой задачи, наверняка кто-то сталкивался, я просто не очень хорошо js знаю, верней плохо, если бы знала хорошо я бы может и решила эту задачу, но сейчас хоть намекните в какую сторону копать
Ответить с цитированием
  #10 (permalink)  
Старый 04.09.2013, 08:45
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Существует вот такой вот финт:
<!DOCTYPE html>
<meta charset="utf-8" />
<style>
	.top {
		display: table-row-group;
	}
	.bottom {
		display: table-footer-group;
	}
</style>
<div class="bottom">Этот текст в коде идет первым, но отобразится внизу</div>
<div class="top">Этот текст в коде идет вторым, но отобразится вверху</div>


Честно говоря, на практике не применял.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Подскажите технологию для реализации. sektor-sumy Общие вопросы Javascript 3 11.04.2013 23:49
Неработает код для форматирования текста Ukrainian Общие вопросы Javascript 10 19.11.2011 23:19
методы String для выбора части текста ? Fail100500 Библиотеки/Тулкиты/Фреймворки 8 01.11.2011 11:30
Форма для ввода текста с расширенными функциями 0x22b Элементы интерфейса 0 01.09.2008 10:38