ナム山

家最高 今年一年でサックスが吹けるようになるか観測中

JavaScript

bxsliderで3個表示のリストを作る、スライドの数に応じてオプションを変える

bxsliderで全幅じゃないスライドを作るときのメモ。 いつも忘れてしまうので備忘録。 slideWidth、minSlides、maxSlides、moveSlidesが揃わないとちゃんと動かない。こちら参考にさせてもらいました。 bxSliderの使い方と「オプション」によるカスタマイズあ…

(GULP) browser-syncでUnhandled 'error' eventが出る

同じく古い環境のGULPをinstallしなおして起動した時に起きたエラーについて。 The following tasks did not complete: default, watch Did you forget to signal async completion? と出てうまく起動しない。GULPが3系から4系になったせいで、記述が悪さを…

GULPでSyntaxErrorが出て立ち上がらなかった

久しぶりに古い開発環境で修正作業があった。 npm installした後にnpx gulpコマンドで立ち上げようとするとgulp-autoprefixerでエラーが出て中断してしまった。 (async () => { ^ SyntaxError: Unexpected token ( つまり' ( 'てなんぞや、とのエラー。 原因…

テンプレートのテキストを一部差し替えて使いまわす - ページ遷移のポップアップテキストを作成する

先日、外部リンクをクリックした際ポップアップにテキストを表示する、という案件を対応した。 遷移先は別ドメインである旨を表示して、遷移する or 留まるリンクをクリックさせるというものだ。 免責事項の表示や、離脱防止などによく使われている。 すでに…

.detach()メソッドについて

先日ライブラリのjsファイルを覗いていた際に見慣れないメソッドを見つけたので調べてみた。 機能 .remove()と似ているが、削除したDOM要素を保持することができる。 js.studio-kingdom.com「detachの場合は関連付けられているjQueryの情報を削除後も保持し…

firefoxで動画が再生されない - 変数の巻き上げと処理順序 -

症状 Firefoxでのみ、JavaScriptからprependしているvideoタグが自動再生されない。 原因 videoタグ自体の不具合でなく、自動再生の関数内で変数がundefinedになる。 自動再生処理がload終了後にちゃんと走っていなかった。 処理順序は以下 ready内でvideoタ…

JavaScriptのオブジェクトをimportして表示する

アプリケーションで生成された画像を、別ページでギャラリーのように表示するシステムの組み込みをした。 以前REST APIで生成されるJSONを取得するコードを書いたのでたかをくくっていたが、いざ組み込もうとしたらES6で表記されていて困ったのでメモ。 REST…