Подробнее/меньше проблема переключения слайдов?

Question

Я не могу это переключить, чтобы читать более или менее слайд-переключатель для работы. Я очень близко, но я не уверен, как отобразить якорь #show-about, поэтому он сначала показывает "read more"?

JSFiddle

$('#show-about').click(function(e){ 
e.preventDefault(); 
$('#about-hidden').slideToggle(); 
$(this).text($(this).text() == 'Read More' ? "Show Less" : "Read More"); 
}); 

Answer 1

Просто измените исходный текст в своей разметке.

<a href="#" id="show-about">Read More</a> 

http://jsfiddle.net/xhLU7/4/

Answer 2

Изменение:

<a href="#" id="show-about">More...</a> 

к:

<a href="#" id="show-about">Read More</a> 

jsFiddle example

Казалось бы, ваша проблема связана с $(this).text() == 'Read More' ? "Show Less" : "Read More", а ваша ссылка имеет текст More.... Когда вы нажимаете на ссылку, $(this).text() равно More..., однако вы сравниваете ее с Read More, поэтому измените ссылку, чтобы она соответствовала, и вы в порядке.

Answer 3

Вы можете сделать это с помощью jQuery как:

JS

$('#show-about') 
    .text('Read More') 
    .click(function (e) { 
     e.preventDefault(); 
     $('#about-hidden').slideToggle(); 
     $(this).text($(this).text() == 'Read More' ? "Show Less" : "Read More"); 
}); 

Демо: Fiddle

---

Но, в случае, если вы можете изменить HTML-разметку и иметь полный Асесс к нему, вы можете просто сделать это:

HTML

<a href="#" id="show-about">Read More</a> 

Answer 4

Почему вы просто не написать на якорь «Подробнее «вместо« Больше ... »?