WEBデザインbxsliderオプションの解説と動かない時のチェックポイント
簡単にスライドショーが作れる「bxslider」ですが、オプションを指定することで色々と設定を変えることができます。 が、最初にハマったのは、そのオプションの書き方・・・ 【どこに書くの？】 公式ページの解説にある、インス...
CSS
WEBデザイン
WEBデザインスライドショーが簡単に作れるbxsliderが便利過ぎる
なんか難しそうなスライドショーが、やってみたら超簡単に実現できた！ こんな奴ですね。 （今どきないと思いますが、当然、javascriptが動かないブラウザでは画像が羅列されるだけとなりま...
WEBデザインposition: sticky; やってみたら超簡単で面白かった
近年新たに追加された機能で、「position: sticky; 」というのがあるのですが、ちょっと必要に迫られて（いや本当は必ずしも必要というわけではなかったのですが、興味本位で）使ってみました。 （こちらにはまだ解説が載っていない...
WEBデザインWordPress（Cocoon）の記事入力時に背景を黒にしたいんです
個人的な好みの問題ではありますが、自分の場合、WordPressで記事を書いている時に、背景を黒にしたいのですよね。 背景が白っぽい画面に長時間向かっていると目が疲れるのです。。。 で、以前、これを実現するために、関数を書き加え...
WEBデザインFACEBOOKにシェアされた記事のアイキャッチ画像を変更したい（※fb:app_idはなくても問題ない、というかないほうがいい）
フェイスブックのシェアデバッガーというのがあります シェアデバッガー - Facebook for Developer...
WEBデザイン上下左右の中央寄せ（中央揃え）まとめ覚書
どうしても、忘れてしまって、毎回調べる事になって無駄な時間を使うので、まとめ覚え書き。(1)領域内のコンテンツの中央揃え(1)-b 内側の領域をinline-blockに(1)-c 外側の領域のpaddingで攻める(2)領域の中央寄せ(左右marginを自動設定に)(3)tableを使う(4)display:table-cellを使う(5)Flexboxを使う
WEBデザインCSSでも変数が使える（ただしIE非対応）
CSS内でも実は変数が使えます。 書き方は セレクタ { --好きな名前:値; } 使う時 var(--好きな名前) ◆具体例１ 宣言 p { --haba:300px; } ...
WEBデザインバナー広告の下にできる余分な隙間をなくすには？
サイドバーに広告ウィジェットを置いていますが、A8やもしもの広告を貼ったら、下に謎の隙間ができてしまうように。 まぁ気にするほどでもないと言えばないかも知れませんが・・・ ・・・気になる～(笑) 下に貼ってみます、環境によ...
WEBデザインCocoon高速化（HTML圧縮）さらにいくつか問題点の修正
Cocoonの高速化機能を実行してみて、いくつか修正しなければならない点がありました。 ひとつは、スタイル記述時のコメントアウトの削除 HTML圧縮機能をオンにすると、コメントアウトが全て削除されるようです。 そのため、b...
WEBデザインiFrameの高さを自動取得する【Javascript】【覚書】
このブログは、上部に"黒板"状のイメージで、「お品書き」を設置しています。 このデザインに拘りがあってそうしているのですが、 しかし、最初に読み込まれるデータが、その分無駄に多くなるわけで、SEO的には良くないという説もあるわけ...
WEBデザインCSSのFILTERプロパティのTEST グレーにした画像をカラーに戻せるか？
ちょっと分かってきた、画像編集と一緒で、一度掛けてしまった効果をあとから除去することはできないっぽいですね。 一度ボカしてしまった画像を、ぼかしを無効にして元に戻すことができないのと同じか。 外側の領域でグレースケール(gray...
WEBデザイン画像編集ソフトを使わずCSSだけで画像をグレーにできる
存在は知っていたもの、使ったことなかった、CSSのFilterプロパティ 使ってみたらめっちゃ面白かった （※でも非対応ブラウザ多し） ブログのデザインをグレー階調にしたくて、デザイン変更をしていたのだけど、画像をグレーに...