jQuery始めました。4(ボタンをクリックしてCSSの設定を変更する)

ボタンをクリックしてCSSの設定を変更するです。


    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />


<script type="text/javascript" src="/jquery/jquery.js"></script>

<title>jQueryテスト4</title>

<style type="text/css">
div{
  width:50px;
  height:50px;
}

#redbox{
  background-color:#800000;
}

#bluebox{
  background-color:#ffa500;
}

</style>
</head>
<body>


<script type="text/javascript"><!--

$(function() {
  $("#solidBtn").click(function() {
    $("p").css("border", "3px solid #ff0000"); 
  });

  $("#dottedBtn").click(function() {
    $("p").css("border", "3px dotted #ff0000"); 
  });

});

//-->
</script>


<button id="solidBtn">solid</button>
<button id="dottedBtn">dotted</button>

<p>
紅葉の季節になりました。
</p>

<p>
週末はきっと多くの人が紅葉狩りに出かけることでしょう。
</p>


</body>
</html>

サンプルは、こちら。

引用元：　プロパティの値を取得

この記事の筆者

管理者