X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Раскрывающийся текст
sc2r2bey
sc2r2bey
Topic Starter сообщение 23.3.2010, 13:41; Ответить: sc2r2bey
Сообщение #1


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


--------------------
Заметки о разработке и не только
программирую web и для we
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
eyexal
eyexal
сообщение 24.3.2010, 12:25; Ответить: eyexal
Сообщение #2


примерно так:

<style>
#text{height:50px; overflow:hidden;}
</style>

<a href="#" onclick="getElementById('text').style.height='auto'; return false;">раскрыть</a>
<div id="text">
тута текст
</div>

это очень сырой пример. но суть некая есть) я не силен в JS
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
yury_mw
yury_mw
сообщение 24.3.2010, 13:32; Ответить: yury_mw
Сообщение #3


sc2r2bey,
Contractible Headers Script (FF1+ IE5+ Opr7+)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sc2r2bey
sc2r2bey
Topic Starter сообщение 25.3.2010, 10:23; Ответить: sc2r2bey
Сообщение #4


немного не то, нужно один обзац виден, а весть тескт скрыт


--------------------
Заметки о разработке и не только
программирую web и для we
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
yury_mw
yury_mw
сообщение 25.3.2010, 15:11; Ответить: yury_mw
Сообщение #5


(sc2r2bey @ 25.3.2010, 9:23) *
немного не то, нужно один обзац виден, а весть тескт скрыт
sc2r2bey,
одно из двух: или я вас не понимаю или вы не можете объяснить чего хочется.
Ниже следующий пример, сделанный за 5минут на коленке, работает так:
При загрузке страницы отображаются абзацы текста с плюсиком в начале.
Если плюсик нажать - он превратится в минус и к соответствующему абзацу
допишется еще пара абзацев.
Если нажать на минус - дополнительный текст снова скроется.

<html>
<head>
<script type="text/javascript" src="ch.js"></script>
<script type="text/javascript">
<!--
if (document.images) {
minus = new Image(13,13); minus.src = "minus.gif";
plus = new Image(13,13); plus.src = "plus.gif";
}

function Change(Name) {
document[Name].src = document[Name].src == minus.src ? plus.src : minus.src;
}
//-->
</script>
</head>
<body>
<div>
<p>
<span onClick="expandcontent('sc1'); Change('a1');" style="cursor:hand; cursor:pointer;"><img src="plus.gif" name="a1" border="0" /></span>
Рыбы (лат. Pisces) — надкласс водных животных, обширная группа челюстноротых позвоночных, для которых характерно
жаберное дыхание на всех этапах постэмбрионального развития организма. В мире известно около 25 000 видов рыб.
В России обитает около 3000 видов, в том числе в пресных водах встречается более 280 видов.
</p>
<div id="sc1" class="switchcontent">
<p>
Водный образ жизни в значительной степени определяет особенности анатомии, физиологии, экологии и поведения рыб.
Среди представителей надкласса наблюдается значительное разнообразие как по внешним признакам, так и по строению
и физиологии.
</p>
<p>
В ходе индивидуального развития хорда замещается позвоночником. Хорда выполняет роль опорного скелета лишь
у личинок и зародышей. Затем она частично или полностью редуцируется, а её функция переходит к позвоночному
столбу. У осетровых рыб хорда сохраняется в течение всей жизни (но вокруг хорды образуются верхние и нижние
хрящевые дуги позвонков). Остатки хорды сохраняются и у костных рыб в виде чёток между двояковогнутыми
позвонками.
</p>
</div>
</div>
<div>
<p>
<span onClick="expandcontent('sc2'); Change('a2');" style="cursor:hand; cursor:pointer;"><img src="plus.gif" name="a2" border="0" /></span>
Уха — русское национальное жидкое блюдо, разновидность супа.
</p>
<div id="sc2" class="switchcontent">
<p>
Версии происхождения названия блюда в основном сводятся к следующей: слово «уха» происходит от древнего
индоевропейского корня *jus, означавшему «отвар» («жидкость»). От данного корня образовалось слово jucha,
которое, утратив начальный j, дало слово «уха». Подтверждением тому служат примеры в других языках, берущие
своё начало от корня jusa в украинском языке — юшка, в белорусском — уха, тот же корень имеют древнепрусское
слово juse (суп с мясом), санскритское yus- (бульон), латинское ius (бульон, сок), сербо-хорватское јуха(похлёбка),
словенское jucha (суп), чешское jicha (соус).
</p>
<p>
Уха является одним из древнейших блюд русской кухни, но на момент возникновения (а его установить невозможно),
оно не являлось характерным и уникальным блюдом русской кухни, каким является сейчас. По известным источникам
ухой в XI—XII веках называли любой суп, из чего бы он сделан не был; более того, некоторые виды блюда представляли
собой что-то подобное современному компоту.
</p>
</div>
</div>
</body>
</html>


ch.js (взято по ссылке Contractible Headers Script (FF1+ IE5+ Opr7+))
/***********************************************
* Contractible Headers script- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use. Last updated Mar 23rd, 2004.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var enablepersist="off" //Enable saving state of content structure using session cookies? (on/off)
var collapseprevious="no" //Collapse previously open content when opening present? (yes/no)

if (document.getElementById){
document.write('<style type="text/css">')
document.write('.switchcontent{display:none;}')
document.write('</style>')
}

function getElementbyClass(classname){
ccollect=new Array()
var inc=0
var alltags=document.all? document.all : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags[i].className==classname)
ccollect[inc++]=alltags[i]
}
}

function contractcontent(omit){
var inc=0
while (ccollect[inc]){
if (ccollect[inc].id!=omit)
ccollect[inc].style.display="none"
inc++
}
}

function expandcontent(cid){
if (typeof ccollect!="undefined"){
if (collapseprevious=="yes")
contractcontent(cid)
document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none"
}
}

function revivecontent(){
contractcontent("omitnothing")
selectedItem=getselectedItem()
selectedComponents=selectedItem.split("|")
for (i=0; i<selectedComponents.length-1; i++)
document.getElementById(selectedComponents[i]).style.display="block"
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function getselectedItem(){
if (get_cookie(window.location.pathname) != ""){
selectedItem=get_cookie(window.location.pathname)
return selectedItem
}
else
return ""
}

function saveswitchstate(){
var inc=0, selectedItem=""
while (ccollect[inc]){
if (ccollect[inc].style.display=="block")
selectedItem+=ccollect[inc].id+"|"
inc++
}

document.cookie=window.location.pathname+"="+selectedItem
}

function do_onload(){
uniqueidn=window.location.pathname+"firsttimeload"
getElementbyClass("switchcontent")
if (enablepersist=="on" && typeof ccollect!="undefined"){
document.cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0"
firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load
if (!firsttimeload)
revivecontent()
}
}


if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload

if (enablepersist=="on" && document.getElementById)
window.onunload=saveswitchstate

Файлы plus.gif [img]http://i029.radikal.ru/1003/fb/2bdf418500f5.gif[/img] и minus.gif [img]http://i078.radikal.ru/1003/4d/bd58b23e795a.gif[/img]

Рыбный текст взят с вики.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
TiP-A-ToP
TiP-A-ToP
сообщение 8.1.2011, 15:08; Ответить: TiP-A-ToP
Сообщение #6


HTML
<script>function showTooltip()
{
var myDiv = document.getElementById('tooltip');
if(myDiv.style.display == 'none')
{
myDiv.style.display = 'block';
} else {
myDiv.style.display = 'none';
}
return false;
}</script>
<a href='java script:;' onclick=showTooltip()> Показать </a>
<div id=tooltip style='display: none'>
Тут текст фыва фыва фыва
</div>

оно??? ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
gaaarfild
gaaarfild
сообщение 10.1.2011, 19:05; Ответить: gaaarfild
Сообщение #7


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

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
« Предыдущая тема · Программная часть · Следующая тема »
 
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) SEO-текст на главной странице сайта и в категориях
 5 boltuk 1429 26.3.2024, 21:43
автор: c4p1t4l15t
Открытая тема (нет новых ответов) Можно ли в старый SEO текст вместо старого домена поставить новый?
 3 Tutich 1217 22.3.2024, 14:47
автор: Tutich
Горячая тема (нет новых ответов) Текст для сайта на английском языке
 33 D007user 18121 26.1.2022, 17:16
автор: D007
Горячая тема (нет новых ответов) Копирайтинг и рерайт: качественный сео-текст по доступной цене!
 374 Sostavitel 196998 18.1.2022, 23:46
автор: Sostavitel
Открытая тема (нет новых ответов) Эффективный копирайтинг. Продающие и инфостатьи, лэндинги. Текст для презентации и видео. Студенческие работы. Наполнение сайтов с нуля
7 лет в сфере, более 77 млн знаков за спиной
 1 ELECTROKATZE 3590 11.6.2021, 18:48
автор: icoder


 

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

RSS Текстовая версия Сейчас: 23.4.2024, 13:48

Дизайн

 
Форум IP.Board © 2024  IPS, Inc.
Лицензия зарегистрирована на: MaulNet
Jooble
Форум IP.Board © IPS, Inc.
Лицензия зарегистрирована на: MaulNet