- 2020年11月4日
- 2020年11月4日
particles.jsで幾何学的な背景を作る。
幾何学的で動的に動く背景が素敵です。 早速、こちらも設置してみましょう。まずはデフォルトのデモをどうぞ。 particles.js デモ01 設置方法 公式の https://vincentgarreau.com/particles.js/ からダ […]
幾何学的で動的に動く背景が素敵です。 早速、こちらも設置してみましょう。まずはデフォルトのデモをどうぞ。 particles.js デモ01 設置方法 公式の https://vincentgarreau.com/particles.js/ からダ […]
bootstap4で nav と navbarを2段にしたかったがどうも悩んだので、備忘録。 やりたかった事。Bootstrap4でNavbarを2段にしたかった。 結論から書くとこんな感じ。 http://kato.space/demo/boots […]
Bootstrap4のcomponetsのcardsでブラウザサイズを小さくするときにレイアウト崩れが出たので、確認してみた。 先に結論から書くとcardに幅指定をしないこと。 参考 @see https://www.w3schools.com/b […]
いままでは余白は自分でクラスを設定していたが、Bootsrtap4では既にマージンやパディングが用意されている。 公式: https://getbootstrap.com/docs/4.1/utilities/spacing/ Where prope […]
このページは更新・編集しながら記述しています。 ウェブサイトの半数がスマホやタブレットになりつつ今、レスポンシブでスマホ対応は必須。 スマホメニューをいつもコードを都度対応しているが、ここで真面目に検証してみる。 まずはbootstrapでの基本の形 […]
スマートフォンでアクセスした決済画面でクレジットカード読み込みがしたい場合がある。 そのときのHMTLタグサンプル。 まずはコード [crayon-65179f2b1ed8f913844916/] 前提条件 1.SSL で […]
前回からの続き 現状の画像をレスポンシブに 既に表示されている画像をレスポンシブにしたい。 で、img タグにclass=”img-responsive” というクラスを追加したい。 function.phpについか [cra […]
某サイトで既にカスタマイズされたテーマがある。 で、これをCSSのフレームワークのBootstrap化したい。単純に呼び込むだけなら、問題ないが、当然レスポンシブになるし、1から作りたいが既に運用しているのでそうもできない(リソース的に) これは、そ […]
どうもBootstrap基本を覚えてないので、再度勉強。 現在のバージョンは2017年3月17日 v3.3.7 まずは基本のサイト構成 公式サイトの基本を書いて保存してみる。 デモ [crayon-65179f2b1f328496353167/] […]
@See https://iwb.jp/jquery-mouseover-mouseout/ mouseoverとmouseoutではなくmouseenterとmouseleaveを使用することでこの問題を解消することができる。 &nb […]
[crayon-65179f2b1f4d7925742623/] この場合、#top_sliderと.top_serveice_listに対して、 すこしコードが汚いが、画面サイズが959pxで
@See http://resocia.jp/column/4463/ 結局 $(function(){ $(‘#top_slider’).fadeIn(1000); });で あとで精査
[crayon-65179f2b1f639218890018/] 画像に以上を。
@See http://creator.dwango.co.jp/9668.html http://rubyinstaller.org/downloads/ Ruby 2.3.3 (x64)をチョイス [crayon-65179f2b1f79433 […]
どうも挙動がいまいちなので、確認 記述の方法を再確認 例 [crayon-65179f2b1f91a370463277/] media=の指定のあとに、 “screen and (min-width:480px) minで○ […]
var urlPram = ‘表示させるURL’; history.replaceState(”,”,urlPram); history.pushState(”,”,urlPra […]
真面目に使う(´・ω・) ス https://analytics.google.com/analytics/ @See https://www.adminweb.jp/analytics/setup/index4.html アカウント ├ プロパティ […]
指定した要素の前後に入れる。 サンプル 選択できないように文字としては認識されないので、SEO的にはあまり意味がない。 応用としてH1とかH2タグの前に【1】とか入れる。 画像も入れることができる。ただ画像サイズは変更できない。 &nb […]
[crayon-65179f2b1fae6331146976/] @See http://www.webdlab.com/guide/jquery-new-date/ [crayon-65179f2b1faeb237239934/] リ […]
東京マラソン2017年のキャンペーンサイト http://pocarigirl.jp/ トップページ、当日準備、レース本番、ムービー、ポカリ説明の5ページ スクロールしてコンテンツ閲覧という感じで、jQuary系のアクション多数。 早速ソース確認 [ […]
[crayon-65179f2b1fefe042244363/] ーカスアウト時に文字を追加、これだと追加されてしまう。 なので、フォーカス時に有れば消すという処理を入れる。 [crayon-65179f2b1ff0283 […]
まずは、公式のGetting startedからサンプルコードをコピーしてみる。 @See https://codezine.jp/article/detail/8145 http://bootstrap3-guide.com/compornent/ […]
Bootstrapのテスト、現在(2017/2/21)のバージョンは 3.3.8 まずは、CDNを使う。 https://www.bootstrapcdn.com/ [crayon-65179f2b202ff856754809/] レスポンシブな感じ […]
[crayon-65179f2b205fe928894883/] 最初の一度だけ実行する、特別メソッドがあります。それがoneメソッド 参考 @See https://app.codegrid.net/entry/practical-jquery- […]
モバイルフレンドリーテスト https://scontent-ord1-1.xx.fbcdn.net とな? @See http://hublog.biz/fb-page-plug-in-cause-blocked-res […]
Mobile Website Speed Testing Tool https://testmysite.thinkwithgoogle.com/ 早速テストじゃ おう…… だめだこりゃ…… & […]
[crayon-65179f2b2078d767852278/] [crayon-65179f2b20792990418379/] 先頭に [crayon-65179f2b20794031981629/] 最後に [crayon-651 […]
[crayon-65179f2b2098e374366610/] ↓ [crayon-65179f2b20992204019219/] セレクタ [crayon-65179f2b20994284516254/] [crayon-6517 […]