2015-10-22 2 views
1

В представлении html я хочу показать некоторый текст, но я хочу показать только процент от всего текста для пользователя, и если пользователь хочет увидеть остальное, ему нужно нажать кнопку href /. Сейчас я скрываю весь текст.Как показать первые буквы X, а затем нажать кнопку href, чтобы показать остальные.

Код для HREF

<div> 
     <h3 id="single-desc"> 
      <a href="#" id="AboutBtn" class="GameInfo">{$l.about_the_game}</a> 
     </h3> 
    </div> 

кодекса для размещения текста.

<div hidden id="showAbout"> 

     <p id="AboutText"> 
      {$game->description} 
     </p> 
    </div> 

JavaScript, чтобы переключить текст скрыть/показать

$("#AboutBtn").on('click', function (e) { 
    e.preventDefault(); 
    $("#showAbout").slideToggle('slow'); 
}); 

Спасибо.

ответ

1

Узнайте больше о Dinamyc!

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    var fullText = $(".text").attr('fullText'); // get fullText attribute 
    $(".text").html(fullText.substr(0,1)); // insert only the first character from the fullText attribute 
    $("#myLink").click(function(e){ 
     e.preventDefault(); 
     $(".text").html(fullText); 
    }); 
}); 
</script> 
</head> 
<body> 

<p class="text" fullText="Fresh Fruits and Vegetables"></p> 
<a href='#' id="myLink">Show Whole Text</a> 

</body> 
</html> 

Удача !!!

+0

Спасибо за ваш ответ @davidpankov. Ваше решение в порядке, но я хочу эффект toggleslide, а также пользователь может вернуться только к просмотру первых символов X. –

+0

slideToggle предназначен только для слайдов вверх и вниз ... не для «права», как вам нужно –

Смежные вопросы