Media
3 items
Description
PC版Google画像検索のプレビュー画面（サイドパネル）を、スマートフォン版のような没入感のある拡大表示に拡張するChrome拡張機能です。 🌟 主な機能 - 拡大表示プレビュー:… PC版Google画像検索のプレビュー画面（サイドパネル）を、スマートフォン版のような没入感のある拡大表示に拡張するChrome拡張機能です。 🌟 主な機能 - 拡大表示プレビュー: 右側に小さく表示されるプレビューを、画面いっぱいのダイナミックなサイズに拡張します。 - シームレスなトグル: 既存の操作ボタン群に「拡大/縮小」ボタンを自動で追加。ワンクリックで切り替え可能です。 - スムーズなアニメーション: 拡大・縮小時に滑らかなトランジションを適用し、心地よい操作感を実現しました。 - スマート・レスポンシブ: 拡大表示に合わせて、関連画像リストも画面幅いっぱいに最適化されたグリッド表示（タイル状）に再配置されます。 - 表示状態の記憶: 拡大・縮小の状態をブラウザに保存します。一度「拡大表示」にすれば、次に画像を開いた際も自動的に拡大された状態で表示されます。 🛠 使い方 1. Google画像検索で好きなワードを検索します。 2. 任意の画像をクリックしてプレビューを表示します。 3. 操作パネル（「前の画像」「次の画像」ボタンの並び）に追加された 拡大アイコン をクリックしてください。 4. 拡大表示モードで、細部まで画像を楽しむことができます。 5. 一度モードを選択すれば、その設定は保存され、他の画像を見る際も維持されます。 📝 こだわりポイント（技術詳細） - MutationObserverの活用: Googleの動的な要素生成を監視し、画像が切り替わるたびに自動でボタンを再配置します。 - 低干渉設計: アニメーション時のみ一時的に `transition` クラスを付与することで、Google純正のUIアニメーションとの干渉を防いでいます。 - アスペクト比の維持: アスペクト比を維持したまま、画面の縦横どちらか限界まで画像を拡大表示するロジックを組んでいます。 - 状態の永続化: `chrome.storage.local` を使用し、ユーザーの好みの表示モードをブラウザを閉じても維持するように設計しました。