Перейти к содержимому

Сервис обмена электронных валют


  • Закрытая тема Тема закрыта

Раскрывающийся текст

#1 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71
0

Отправлено 23 Март 2010 - 12:41

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

 

 

  • 0

#2 eyexal

eyexal
  • Пользователь
  • 29 сообщений
  • Репутация: 0

Отправлено 24 Март 2010 - 11:25

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

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

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


это очень сырой пример. но суть некая есть) я не силен в JS


  • 0

#3 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 24 Март 2010 - 12:32

sc2r2bey,
Contractible Headers Script (FF1+ IE5+ Opr7+)


  • 0

#4 surfer

surfer
    Topic Starter
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 25 Март 2010 - 09:23

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

#5 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 25 Март 2010 - 14:11

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

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 Изображение и minus.gif Изображение

Рыбный текст взят с вики.
  • 0

#6 TiP-A-ToP

TiP-A-ToP
  • Пользователь
  • 119 сообщений
  • Репутация: 0

Отправлено 08 Январь 2011 - 14:08

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>
оно??? ;)
  • 0

#7 gaaarfild

gaaarfild
  • Пользователь
  • 596 сообщений
  • Репутация: 0

Отправлено 10 Январь 2011 - 18:05

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


Оформление форума – IPBSkins.ru