-3

私はあなたにとって簡単なことを質問しているので、私の質問は迷惑かもしれないことを知っています。もちろん、私はそれを自分でチェックすることができますが、それは私には難しすぎます。divの幅と高さ、背景色とフォントを見つけることはできますが、ここで見つけることができることを実行するためのコードを見つけることができません： http ://easyelo.com/FAQ の下部近くページのクリック>>すると、説明付きの追加テキストが表示されます。これをどこで行っているのかを確認する方法がわかりません。誰かが私を助けてくれますか？

<div class="more" style="font-family: arial; margin-bottom: 10px; margin-top: 10px; display: block;">
                <i style="line-height: 20px; font-size: 15px;font-family:arial;">Sorry, we don’t do any jobs until they are paid for; however, we do allow you to pay in increments as small as 10 euro. </i>
                </div>
4

1 に答える 1

3

簡単な解決策は次のとおりです。

次のコードを使用して要素を作成します。

<div id="mainLine">The immediately visible part of the thing here. <a href="#" id="more">>></a>
<p id="hiddenText">This thing appears and disappears as you click the '>>' at the end.</p>

そして、このjQueryスクリプトを使用して、ページが読み込まれたときに要素を非表示にし、「>>」がクリックされたときにのみ要素を表示します。

$(document).ready(function(){
$("#hiddenText").hide();});

$(document).ready(function(){
$("#more").click(function(){
    $("#hiddenText").slideToggle("slow"); }
                 );
});

また、興味がある場合は、「>>」からアンダースコアを削除するCSSを次に示します。

a
{
 text-decoration: none; /* I'm trying to make it look more like the original */
 }

実用的な例はhttp://jsfiddle.net/2b7Vp/にあります。

これはSOに関する私の最初の回答であり、これがお役に立てば幸いです（@Pavel Sterbaのコメントから一部盗まれました。ありがとうございます！）。

于 2013-03-26T16:33:16.223 に答える