web制作 Googleマップ活用
GoogleマップをHTMLに埋め込むのは簡単です。
Googleマップの埋め込み
Googleマップへアクセスし、目的の住所を検索、表示された結果に共有ボタンがあると思いますので、それをクリックします。すると「リンクを送信す...
レスポンシブ
web制作 CSS バラバラなサイズの画像を同じサイズにして表示する方法
サイズがバラバラな画像をスライダーなどにして同じサイズで表示させたいことがあったので、いろいろと検索してみました。
実際は思った表示にはならないのですが、イメージに近い表示になりました。
できるだけ同じようなサイズの画...
web制作 クリッカブルマップ（イメージマップ）をレスポンシブ対応にする
あまり必要な場面はないかもしれませんが、今回必要になったので覚書として。
まずはDreamweaverなどでも座標を簡単に作成することが出来ますが、サイトでも簡単に作成できます。
私が利用しているのはこちらのサイト。
他...
web制作 YouTubeの埋め込み設定
iframeを使う方法
簡単で手軽な方法です。YouTubeのプレイヤーのしたの共有ボタンを押すとリンクの共有の中に「埋め込み」という項目があります。こちらをクリックするとiframeのタグが表示されるので埋め込みたい部分にコピペ...
web制作 pxをvwに変換する計算方法
cssにはcalc機能がついているので、デザインから画像サイズ等々をvwに計算する計算方法を見つけたのでメモ。
px÷画面サイズ×100＝vw
上記で計算できるようです。いろんなサイトを見て、色んな方法があるようですが、こちら...
Bootstrap スマホのhover
最近はモバイルファーストでスマホ対応のサイトがほとんどです。
スマホ用のサイトを作成する方法とレスポンシブサイトとして
スマートフォンもPCも同じページのレイアウトを変更して
見せ方を変える方法とで対応してるサイトがあります。
今回はB...
レスポンシブ 固定したナビにスクロールをつける応急処置
ヘッダーを固定してハンバーガーメニューをつけると
長いメニューの場合は下の方に記載されているメニューが
表示されないということも、、、
そこで作り方を変更したほうが良い時もありますが、
時間がない場合はスクロールをつける方法。
表示する...
レスポンシブ SVG作成 アンドロイドで表示できない場合
pngファイルをsvgに変換する作業を行ったのですが
サイト上からの変換だときれいなSVGが作成できず
illustratorで作業しても、結局ベクター画像でないので
綺麗に変換できず、Photoshopを利用してみたところ
見た感じきれい...