Heidel
24.10.2012, 13:51
Новости на странице выводятся в таком виде
http://static.diary.ru/userdir/2/0/0/4/2004853/76481118.jpg
код HTML
<div class="news">
<div class="news-date">12/01/2004</div>
<div style="clear: both;"></div>
<div class="news-text short"><a href="/">Lorem ipsum dolor sit amet,</a> consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. tUt wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis Lorem ipsum dolor sit amet consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. tUt wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis</div>
<div class="news-link"><a href="/">• read more</a></div>
<div style="clear: both;"></div>
</div>
текст новости в блоке news-text показан не полностью, для этого к нему добавлен класс
.short {
height: 80px;
overflow: hidden;
}
Нужно, чтобы по клику на ссылку read more класс short удалялся и текст показывался целиком, а текст в ссылке заменялся на collapse, а затем при клике на collapse класс short снова добавлялся, и текст в ссылке обратно заменялся на read more.
Для этого мне подсказали скрипт на jQuery http://jsfiddle.net/b4hhy/10/
он срабатывает на jsfiddle, но когда я подключаю его к странице, он не выполняется.
Не могу разобраться, в чем дело, почему он может не работать?
К странице еще подключен лайтбокс, может в этом быть причина?
http://static.diary.ru/userdir/2/0/0/4/2004853/76481118.jpg
код HTML
<div class="news">
<div class="news-date">12/01/2004</div>
<div style="clear: both;"></div>
<div class="news-text short"><a href="/">Lorem ipsum dolor sit amet,</a> consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. tUt wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis Lorem ipsum dolor sit amet consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. tUt wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis</div>
<div class="news-link"><a href="/">• read more</a></div>
<div style="clear: both;"></div>
</div>
текст новости в блоке news-text показан не полностью, для этого к нему добавлен класс
.short {
height: 80px;
overflow: hidden;
}
Нужно, чтобы по клику на ссылку read more класс short удалялся и текст показывался целиком, а текст в ссылке заменялся на collapse, а затем при клике на collapse класс short снова добавлялся, и текст в ссылке обратно заменялся на read more.
Для этого мне подсказали скрипт на jQuery http://jsfiddle.net/b4hhy/10/
он срабатывает на jsfiddle, но когда я подключаю его к странице, он не выполняется.
Не могу разобраться, в чем дело, почему он может не работать?
К странице еще подключен лайтбокс, может в этом быть причина?