jQuery/css()

解説

css要素を加える
.css(property, value);
css要素を取得
.css(property)

sample1

s1Div01

s1Div02

sample1code

function s1Func01(){
  $(this).css({
    background:"red",
    color:"black",
    transform: "scale(1.2)",
    transform: "rotate(-45deg)"
  });
}
function s1Func02(){
  $(this).css({
    background: "black",
    color: "yellow",
    filter: "blur(2px)",
    transition: "0.5s"
  });
}

sample3

sample2code $(function(){ $("#smallFont").click(function(){ $("#s2Fieldset").css("fontSize", "10px"); }); $("#mediumFont").on("click", function(){ $("#s2Fieldset").css("fontSize", "15px"); }); $("#largeFont").on({ click: function(){ $("#s2Fieldset").css("fontSize", "20px"); } }); });

sample3

sample3code

$(function(){
  $("#sample3 div").click(function () {
    var color = $(this).css("background-color");
    $("#result").html("背景色: " + color + ".");
  });
});

sample4

sample4code

$(function(){
  $("#s4Btn").click(function(){
    $("#s4Field").css({
  	  "background-image": "url('../../img/reims.jpg')",
  	  "background-attachment": "fixed",
  	  "background-size": "cover"
    });
  });
});