私はRead Moreボタンをしようとしていますが、JavaScript/jqueryを使用し始めました。

Question

Read Moreボタンをクリックするとページが展開され、テキストには素敵なアニメーションが表示されます。 jqueryコードを実行しようとしましたが、動作しないと認識して削除しました。テキストが200文字を超える場合、[続きを読む]ボタンが表示されます。私はthisのような基本的なものしか持っていません。

Javascriptコード：

$("#clickme").click(function() { 
$("#hidden").show(); 
}); 

Answer 1

を使用することができますshow(),fadeIn(),slideDown(),animate()のような多くのjqueryの関数を使用することができますロジックは次のようになります。 1：PHPを使用している場合は、文字列の長さを確認してください。ログインは次のようになります。

<?php $str = "I am in love with PHP"; 
if(strlen($str) > 10) 
{ 
    $showten = substr($str, 0, 10); 
echo $showten . "<a href="#" class='readmore'>Readmore</a>"; 
} 
?> 



<div class="all-content"><?php echo $str; ?></div> 

今jQueryが行動に出る：

<script> 
$(document).ready(function() 
{ 
$('.readmore').click(function() 
{ 
    $(this).closest("div").find(".all-content").toggle(); 
}); 
}); 
</script> 

これは、サンプルコードでは、あなたの要件ごとにマイナーmodifcationsを作成する必要があります！

Answer 2

はこれを使用してみてください：

$("#clickme").click(function() { 
    $("#hidden").fadeIn("slow"); 
}); 

Answer 3

あなたは、そうであっても基本的にあなたが記述する必要がCSSトランジションに

Answer 4

ここでは別のjqueryアニメーションを見つけることができます。

http://api.jquery.com/animate/ 

Answer 5

これを試してください：

$("#clickme").click(function() { 
    $("#hidden").fadeIn("slow"); 
});