jquery-plugin-circlifulプラグインのanimateInViewを動作するように修正
jQueryで円グラフをアニメーションで描画するCirclifulプラグインを導入しました。
簡単でかっこいい!と思ったのも束の間、スクロールして可視領域にたどりついた時には描画が既に終わっている。
animateInView
オプションを発見して設定するも、今度は描画されず。
どうやらChromeだとバージョンによっては動作しないようで、その修正方法。
jquery.circliful.js
function isElementInViewport() { // Get the scroll position of the page. var scrollElem = ((navigator.userAgent.toLowerCase().indexOf('webkit') !== -1) ? 'body' : 'html'); var viewportTop = $(scrollElem).scrollTop(); var viewportBottom = viewportTop + $(window).height();
この321行目を下記のように修正します。
var scrollElem = ((navigator.userAgent.toLowerCase().indexOf('edge') != -1) ? 'body': 'html, body');
jquery-plugin-circliful
はGitHubからダウンロードできます。
ディスカッション
コメント一覧
まだ、コメントがありません