サイトで、レイアウトを編集で管理画面からCSSを編集することがあるかと思います。

HTPからCSSファイルをダウンロードしてきて、編集、アップロードの作業をするのも中々手間ですよね。

ですが、管理画面でCSSを編集しても、サイトに反映されていないという経験をした人もいるのではないでしょうか。

原因の一つにキャッシュというものがあり、ブラウザ側が古いほうのCSSを読みに行くため、新しいCSSを読み込めないということがあります。

上記のように
PHP関数「filemtime()」を使い、そのファイルの最終更新日を取得して、新しいファイルを読み取りに行くように指定してあげることで、
キャッシュによる問題を解決することができます。

ファイルを更新してもサイトに変化がない場合、試してみるとよいでしょう

メニューボタンやプルダウンなど、アニメーションが終わる前に、開閉ボタンを連打すると、
何回もメニューの開閉をしたり、挙動が変わってレイアウトが崩れてしまうなど問題が起きてしまう場合があります。

何回もメニューボタンを押す人は少ないでしょうが、意図した問題が起きないように、
クリック対策をしておくのも必要でしょう。

連打によって連続で動作させたくない場所に .stop(true, false) を追加します。

上記のようにmenu.stop(true, false)を.animateの前に記述することで、連打したとしても、連続でメニューが開閉しないようになります。

CSSのプロパティのfont-feature-settingsで自動カーニングをすることが可能です。

ですが、すべてのフォントで自動カーニングしてくれるわけではありません

利用できるフォントは、

1,OpenTypeフォント
2,プロポーショナルメトリクス情報がフォントに含まれている

上記の条件を満たすフォントは

ヒラギノ角ゴシックヒラギノ明朝、游ゴシック、游明朝

webフォントではNoto Sans CJK JPなどです。

文章などに基本的に使用するメイリオにはプロポーショナルメトリクスの情報は含まれていません。

ですのでfont-feature-settingsでは自動カーニングが残念ながらできません。

EdgeやIE11では

text-align:justify
text-justify:inter-ideograph
font-feature-setting : “palt”

上記をあわせて使用した場合、両端揃えができないなどの不具合がありますが、

プロパティ自体の対応状況は、大体のモダンブラウザで使用できます。
Notoフォントなど和文フォントを使用する際などに利用してみると、きれいに読みやすくなるサイトになるかと思います。

Google Feed APIが終了したとのことで

Google Feed APIの代替策としてjqueryを使用したrssの収得方法です。

以下のコードでは同じドメイン内の RSS を読み込んで表示することが可能です。

jqueryのみで簡単にrssを取得可能なので、ブログの最新記事などをhtmlサイトに表示させたいときなどに便利ですね。

レスポンシブサイトでは、pcやタブレット、スマートフォンなどで見え方やデザインが大きく変わったり、処理したいプログラムを変更したい場合があるかと思います。

今回はブレイクポイントごとににJavaScriptの切り替える方法を紹介します。