http://fonshitu.fc2web.com/mikan/
昨日の今日なんですがホームページのソースとCSSを更新してhover(パソコンからみているときにマウスカーソルをのせると反応するやつ)がスマホでも効くようにしました。あとマルフク看板を触ると微妙にズレるようにした。こういうどうでもいい要素を仕込まないと死ぬ病の渦音P
書いておかないと忘れる
@media（画面の横幅に合わせて表示を切り替える）を使うときはhead内にこれを入れておかないと反応しない。
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
hoverをスマホからでも反応させる：要素を囲っている要素（一番外側のdiv）に「 ontouchstart=""」を置く
<div class="flex-container" ontouchstart="">
（中略）
</div>
マルフク看板
CSS
.kanban{
margin:15px auto;
padding:1px;
border-radius:15px;
border: 5px solid rgba(250, 240, 210, 0.9);
background-color:rgba(237, 190, 190, 1);
box-shadow: 0 5px 4px rgba(231, 203, 191, 0.9);
transition: all .1s;
}
.kanban:hover{
box-shadow: 0 3px 2px rgba(231, 203, 191, 0.9);
transform: translate(0, 1px) rotate(1deg);
transform-origin: left top;
}
.kanban-ue{
width:100%;
margin:0;
padding:25px 0;
border-radius:10px 10px 0 0;
background-color:rgba(220, 48, 22, 1);
}
.kanban-shita{
width:100%;
margin:0;
padding:5px 0;
border-radius: 0 0 10px 10px;
background-color:rgba(250, 240, 210, 0.9);
}
.kanban h2 {
color:rgba(250, 240, 210, 0.95);
text-align: center;
margin:auto auto;
}
.kanban p {
color:rgba(220, 48, 22, 1);
font-size:16px;
text-align: center;
}
html
<div class="kanban">
<div class="kanban-ue">
<H2>○あの看板</H2>
</div>
<div class="kanban-shita">
<p>電話番号-とか-諸々</p>
</div>
</div>
jubeat:POP TEAM EPICの「クソフメン！？」（Bメロにある文字押し。歌詞でいうと「無意識バイアス」にあわせて1文字ずつ来る。！と？は分割）をつないでその直後に切る。
DDR:コーストライアル「SHED TEARS」が来ました。「insist / Tomoyuki Uchida feat.秋成」が移植されましたわよーーーッ！！ノスタルジアOp.2からの移植曲でポップンでも遊べる都会的でおしゃれでジャジーな歌モノです。足でやらせていただけるんですか！？（うれしい） コーストライアルの前2曲はしっとりしたバラードでSilly Love（ムービーが失恋から立ち直るストーリー仕立て）からのinsistというなかなかイカした選曲ですが、パネルがハマってコンボを切り静かに落涙するのであった。
