メモ９ - まとめ @ ウィキ

前月					翌月
日	月	火	水	木	金	土

var sampleElement = document.getElementById('sample');
 
    sampleElement.classList.add("setClassName");
 
 

---

$(function () {
 
  $('#ID名').on('click', function () {
 
    $('#result').text( $('[name="fruit"]:checked').val() )
  })
 
})
-------------------------
$(function() {
 
   $("li:contains('東京')").css("color", "red");
 
});
-------------------------
var tdx = document.getElementsByTagName("td");
 
    for ( i = 0; i< tdx.length; i++){
 
        var chk = tdx[i].innerText;
 
        if ( chk != "0" ) {
 
            tdx[i].className = "today_bgcolor";
 
        }
 
    }
 

---

.cube-container {
  position: relative;
  width: 40px;
  height: 40px;
  perspective: 1000px;
}
.cube {
  position: absolute;
  width: 40px;
  height: 40px;
  margin-top: 20px;
  margin-left: 20px;
  transform-style: preserve-3d;
  animation: roll-over 1s linear infinite;
}
.cube .side {
  position: absolute;
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  border: 1px solid #666;
  text-align: center;
  font-size: 20pt;
}
.side1 { background: #f66; transform: rotateY(0deg) translateZ(20px); }
.side2 { background: #6f6; transform: rotateY(180deg) translateZ(20px); }
.side3 { background: #66f; transform: rotateY(90deg) translateZ(20px); }
.side4 { background: #6ff; transform: rotateY(-90deg) translateZ(20px); }
.side5 { background: #f6f; transform: rotateX(90deg) translateZ(20px); }
.side6 { background: #ff6; transform: rotateX(-90deg) translateZ(20px); }
@keyframes roll-over {
  from { transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); }
  to { transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); }
}
 

1

2

3

4

5

6

<div class="cube-container">

 <div class="cube">
   <div class="side side1">1</div>
   <div class="side side2">2</div>
   <div class="side side3">3</div>
   <div class="side side4">4</div>
   <div class="side side5">5</div>
   <div class="side side6">6</div>
 </div>

</div>