こんにちは、パソコンインストラクターの川上雄大です。
こちらの過去記事
『【再アップ記事】サイドバーにスライドショーを設定するには』
に、
コメントをいただいております。
うまくできたとのこと。良かったです^^!
しかしなにやら別のご質問も書いている？？？
「マウスオーバーで画像が大きくなるように」
ということですが、このようなこと↓
でしょうか。
（スマホ、iPhoneで見られている方、何を言っているのかわからなくてすいません。PCでご確認くださいませ。）
もしも、こういうこと（上の画像にマウスをのせると、画像が大きくなる）でよければ、
CSSに、次のコードを追加して、
（アメブロのデザインが「CSS編集用デザイン」の方のみとなります。→『CSS編集用デザインって』）
.scale img:hover {
transform: scale(1.15,1.15);
}
※（ ）内の数値は縮尺を表しています。自由に変えてくださいませ。1.2や1.3など。
大きくしたい画像のHTMLソースを、
（画像挿入後、「HTML表示」に切り替えて）
<p style="text-align: center;"><a href="https://stat.ameba.jp/user_images/20171114/10/sumitak1329/3a/72/j/o0579030414070148781.jpg"><img alt="" contenteditable="inherit" height="304" src="https://stat.ameba.jp/user_images/20171114/10/sumitak1329/3a/72/j/o0579030414070148781.jpg" width="579"></a></p>
先頭の「<p」の後に、
class="scale"
をコピペするとOKです。
ただし、
pとclassとstyleの間は、半角スペースを入れてくださいませ。
<p class="scale" style="text-align: center;"><a href="https://stat.ameba.jp/user_images/20171114/10/sumitak1329/3a/72/j/o0579030414070148781.jpg"><img alt="" contenteditable="inherit" height="304" src="https://stat.ameba.jp/user_images/20171114/10/sumitak1329/3a/72/j/o0579030414070148781.jpg" width="579"></a></p>
あ、「プレビュー」画面では事前にチェックできませんので、あしからず^^;
＜追記＞
この記事では、特定の画像に指定する場合のことを書きましたが、
記事内全部の画像を拡大するのであれば、次のCSSコードになります。
●プロフィール画像が四角いデザインの場合
.skinArticle img:hover {
transform: scale(1.15,1.15);
}
●プロフィール画像が丸いデザインの場合
.skin-entryBody img:hover {
transform: scale(1.15,1.15);
}
以上、アメブロ便利技でした。
１年振りの東京ライブになります。
日時：11月17日（金）18:30 Open、19:00 Start
場所：Leaf room豪徳寺
東京都世田谷区豪徳寺1-23-12
コンフォート豪徳寺3F
（小田急線「豪徳寺駅」より徒歩2分）
TEL050-1369-5567
ライブチャージ：2,500円（税込）（ドリンク代別）
お申し込みはこちらから
LIDS札幌・ライフデザインスクール
川上 雄大
