Frontend

2018/4/5から生じているAmazon Product Advertising APIの文字化けをphpで元に戻す方法。

2018/4/5ごろからAmazon Product Advertising APIの文字化けが生じているようです。→4/6に元に戻りました。

はてなのリンク作成ツール、カエレバなどAmazon APIでデータを取得しているサービスに影響がでているようです。

続きを読む

jQueryでanimateできない原因は? $(…).animate is not a functionが出る場合

jQueryでanimate関数を使ってアニメーション動作をしようとしたら、次のようなエラーが出ることがあります。

Uncaught TypeError: $(...).animate is not a function

 

これは、jQueryのslim版を使用しているのが原因かもしれません。

slim版では、ajax系関数が使えないことはよく知られていますが、実は、アニメーション系の次の関数もサポートされていません。

animate
fadeIn
fadeOut
fadeToggle
fadeTo
finish
stop
slideDown
slideUp
slideToggle

 

slim版を使用している場合は、full版に切り替えましょう。

CDNを使用している場合は、jquery.min.slim.jsの部分をjquery.min.jsと書き換えるだけです。

jQueryは頻繁にバージョンアップしますので、これを機に最新バージョンのものに切り替えても良いかもしれません。

 

ファイルサイズの差は、jquery 3.0.0では、slim版23.6 kBに対し、full版は30 kBです。25%分サイズが増えますが、あまり気にならない場合が多いと思います。

(なおminは圧縮を意味していますので、機能に違いはありません。)

 

CDNへのリンク

jquery – cdnjs.com

 

animateのリファレンスはこちら。

animate(params, [duration], [easing], [callback]) – jQuery日本語リファレンス

 

stackoverflowでも同様の質問が出ていました。

jquery : $().animate() is not a function – stackoverflow

 

jQueryの実践テクニックが多く載っている売れ筋の本です。

 

以上、jQueryでanimateできない原因は? $(…).animate is not a functionが出る場合でした。

Chart.jsのパイチャートがスマホ画面で潰れてしまうのを防ぐ方法!

Chart.jsはレスポンシブ対応のjavascriptチャートライブラリです。

レスポンシブ対応を謳っていますが、パイチャート/ドーナッツチャートをスマホなどの幅の狭い画面で表示させると、パイが縮小されすぎて見づらくなってしまいます。

それを防ぐ方法を紹介します。

続きを読む