0

2つの別々のリンクで2つのdivを切り替えるJavaScriptを少し持っています。たとえば、表示するdiv 1を選択した場合、リンクの横に小さな弾丸が表示されるなど、選択したリンクの横に小さな画像を追加したいと思います。 div 2を選択すると、div2に箇条書きが表示されます。ここにスクリプトは誰でも助けてくれます:)

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">



  <style type='text/css'>


  </style>


  <script type='text/javascript' src='http://code.jquery.com/jquery-1.6.2.js'></script>

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
$(function(){

    $('a[id^="link"]').click(function(){
        var vid_id = $(this).attr("id").replace("link", "#testVid");
        $('div[id^="testVid"]').hide();
        $(vid_id).show();
    });
    $('span[id^="close"]').click(function(){
        var vid_id = $(this).attr("id").replace("close", "#testVid");
        $(vid_id).hide();
    });
});

});//]]>  

</script>


</head>
<body>
  <div>
    <a href="#" id="link1">Click Link 1</a><br />
    <a href="#" id="link2">Click Link 2</a><br />

    <div id="testVid1" style="background:pink; height:300px">Test Vid Div 1<br /><br /><span id="close1">CLOSE 1</span></div>
    <div id="testVid2" style="display:none;background:pink; height:300px">Test Vid Div 2<br /><br /><span id="close2">CLOSE 2</span></div>

</div>

</body>


</html>
4

1 に答える 1