0

基本的に 1 つのページである Web ページを作成しようとしていますが、下部にあるメニュー ボタンをクリックするとフェードインおよびフェードアウトする 4 つの「隠し」div があります。

これらの各 div の上部に「閉じる」ボタンを配置して、その div を「閉じる」ことができるようにしたいと思いますが、新しいメニュー項目がクリックされたときに div が独自にフェードアウトする場合は素晴らしいことです。これまで、css と html を使用して div ボックスとリンクを作成してきましたが、javascript に関してはまったくの初心者です。ここに私がこれまでに持っているコードがあります

HTML: 

<div class="menu">
    <a class="portfolio" href="http://www.google.com"> Portfolio </a> | <a  class="aboutme" href="http://www.google.com"> About Me </a> | <a class="education" href="http://www.google.com"> Education</a> | <a class="contact" href="http://www.google.com"> Contact</a>
</div>
<div>`

（注：他に何を入れればいいのかわからなかったので、リンクターゲットとしてgoogleだけを入れました）。

CSS:

.aboutmewindow
{
    width:583px;
    height:557px;
    border-bottom-style:dashed;
    position:absolute;
    top:0px;
    z-index:2;  
}

.portfoliowindow
{
    width:583px;
    height:557px;
    border-bottom-style:dashed;
    position:absolute;
    top:0px;
    z-index:2;  
}

.educationwindow
{
    width:583px;
    height:557px;
    border-bottom-style:dashed;
    position:absolute;
    top:0px;
    z-index:2;  
}

.contactwindow
{
    width:583px;
    height:557px;
    border-bottom-style:dashed;
    position:absolute;
    top:0px;
    z-index:2;  
}`

私は自分で JavaScript を少し書いてみましたが、現時点では私の深みには達していません。チュートリアルを続けていきますので、うまくいけばコツがつかめると思います。

誰にも提案はありますか？または良いチュートリアル？

ありがとう！

4

3 に答える 3

0

fadeIn()またはを使用できますfadeOut()。

次のように使用します。

$('selector').fadeIn(); // you can use time in ms, inside ()

同様に、あなたも使うことができますfadeOut。ただし、Web ページに最新バージョンの jQuery がリンクされていることに注意してください。

リンク:

http://jquery.com

于 2013-10-16T15:01:50.480 に答える
0

これは少し古い (2012 年 8 月) チュートリアルで、要素をフェード イン、フェード アウト、および特定の不透明度にフェードするために必要な HTML、CSS、および JavaScript を示しています。

http://www.mkyong.com/jquery/jquery-fadein-fadeout-and-fadeto-example/

基本的に、次のことについて学ぼうとしています。

于 2013-10-16T15:03:13.760 に答える