【カスタマイズ】サムネイルにマウスが乗った際にズームされて、少し白くなるような効果をつけるコードをやっと理解できた件。トレ・ビジネスフォローするHOMEDateCafeMovieWorkoutTravelCustomizeLanguageホームBusinessCustomize【カスタマイズ】サムネイルにマウスが乗った際にズームされて、少し白くなるような効果をつけるコードをやっと理解できた件。Customizeしばらくコピペで使って気に入ったからつけていたマウスが載るとズームされて、霧がかかって白くなる効果。コードがなんか複雑でわからなかったのですが、やっと解読できたのでまとめます。すごいよかったのですが、なんか白くなりすぎだし、ズームされすぎ、なんかうざい。思ったのがきっかけです。スポンサーリンクスポンサーリンク具体的にサムネイルのどの部分?上の画像の上にマウスを置くと。こんな感じで霧がかかったようになって、ズームになるという仕様です。なんとなくおしゃれだなって思って使ってました。コードの挿入、style.cssへでは早速コードを記入。子テーマへ、バックアップも忘れずに。scale(1.05,1.05);}以上でこのサイトと同じようなエフェクトに設定可能です。これだけでは自分好みのエフェクトへ設定はできないので、解説していきます。;の部分の「0.2s」の部分。最後に【s】がついているので勘の良い方はわかるかと思いますが、拡大に何秒かけるか?と言うのを設定するコードになります。この数字を大きくすればゆっくり拡大する事になります。0.7;の部分で「0.7」は霧のかかり具合を設定できます。パーセンテージなので、数字を低くすればするほど、オリジナル画像より薄くなり、より濃い霧がかかったようになります。scale(1.05,1.05);}の「1.05」はマウスオーバーした時にどれだけ拡大するかを指定しています。「scale(1.05)」は「105%の大きさに拡大する」と言う意味です。「scale(1.0)」とすると大きさは100%のままになるので変化しないと言う事になります。以上の数値をいじって、お好みのエフェクトを実現するのに役立つと幸いです。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。SEARCH新着記事そのまま使える。ソーサリート【9月】購入株Wi-FiレンタルよりSIM購入で割安旅行2019年3月購入株PROFILE都内在住の旅好き20代のブログです。大好きな海外旅行の情報まとめをメインに毎日を少し楽しくするTipsを書いています。