0

ボタンをクリックしたときにdivを表示しようとしています。私が表示することを期待しているdivは.photo1です。フィドルには背景色のブロックだけを使用しましたが、実際にはクリックすると表示される画像になります。現時点では、クリックしても何も起こりません。

助けてくれてありがとう。

私のコードはここのjsfiddleで見つけることができます

htmlは次のとおりです。

<body>
    <ul class="menu">
        <li>
            <a href="#" onclick="showStuff('photo1')";> show the block </a>
       </li>
    </menu>
    <span div id="photo1" style="display: none;">
        <brandinfobox class="photo1"> </brandinfobox>
    </span>
</body>

javascriptは次のとおりです。

function showStuff(id) {
    document.getElementById(id).style.display = 'block';
}

CSSは次のとおりです。

.menu {
    position:absolute;
    background-color: orange;
    background-size: 40, 130px;
    font-size: 14px;
    left: 20px;
    text-align: center;
    line-height: 40px;
}
brandinfobox {
    position: absolute;
    height: 384px;
    width:620px;
}
.photo1 {
    position:absolute;
    top: 100px;
    left: 100px;;
    background-color:black;
    width:200px;
    height: 200px;
    background-size: contain;
}
4

1 に答える 1

1

あなたのコードは信じられないほど厄介なので、HTMLタグ、CSSクラス、IDについて学ぶことをお勧めします。具体的には、どこで使用する必要があるかです。

ただし、機能しなかった理由は、JavaScript関数がページの読み込み時にスコープ(アクセスのみ)されていたためです。これをheadまたはbodyタグ(JSFiddleの左側のメニューから)に配置すると、ブラウザーがshowStuff関数を見つけることができるようになります。

次のJSFiddleでクラスとタグの使用を整理しようとしました:http://jsfiddle.net/jaypeagi/WFuRX/2/

于 2013-03-18T13:05:56.613 に答える