PhotoSwipe v5 の使い方(最低限のコードで簡単実装)
はじめに 以前、古いバージョンのPhotoSwipeの使い方の記事を書きました。あれからしばらく経ち、新しいバージョンのPhotoSwipeが出てたので、使い方をまとめてみます。 今度のPhotoSwipeはより簡単に設 […]
はじめに 以前、古いバージョンのPhotoSwipeの使い方の記事を書きました。あれからしばらく経ち、新しいバージョンのPhotoSwipeが出てたので、使い方をまとめてみます。 今度のPhotoSwipeはより簡単に設 […]
はじめに 以前、jQueryを使ったAjaxの使い方について記事にしましたが、ライブラリに依存しないFetchという最近よく使われている方法をまとめてみました。 【Javascript】Ajaxを使ってサーバ(PHP)に […]
とあるJSONファイルをJSON.parse()で読み込もうとしたところ、以下のようなエラーが出た。 Uncaught SyntaxError: JSON.parse: bad control character in […]
Webアプリなどをレスポンシブデザインで作っている時、PCではカーソルホバー、モバイルではロングタップで要素を表示させたりしたい場合があります。意外にもロングタップイベントを受け取る方法が確立されていないので、自分で実装 […]
画像やコンテンツのスライドショーが簡単にできるJavaScriptライブラリー「Swiper.js」のautoplayオプションが効かなくて、しばらく迷走した時の話。 現象 「Swiper.js」をnpmでインストールし […]
この記事の内容は古いバージョンの実装方法です。新しいPhotoSwipeバージョン5の実装方法を知りたい場合は、以下の記事をご覧ください。 はじめに サムネイル画像をクリックすると拡大表示できるJSライブラリ「Photo […]
以前、ショートコードを使って自作のPHPやJavaScriptを動かす方法を紹介しましたが、今回は、ページ毎に別々のJavaScriptを読み込む方法をご紹介します。 ファイルのアップロード まず、スクリプトファイルを用 […]
JavaScriptでselect要素の、ある項目を選択状態にしたかった時に、ちょっとハマったのでメモ。 似たような処理で、JavaScriptでselect要素のデフォルトの項目を設定する方法がありますが、それと混同し […]
はじめに 写真を縦横比を維持したままタイル状に綺麗に並べるためのライブラリー「Mosonry」の必要最低限の実装方法です。 CSSで正方形にトリミングして並べる方法は一般的ですが、トリミングせずに並べる必要があったので、 […]
はじめに Ajax「Asynchronous JavaScript + XML」を使ってJavaScriptからサーバ側(PHP)にデータを渡す事ができます。 サーバ側でデータを受け取って処理した後、JavaScript […]
例えば、メニューボタンを押すとメニューが開き、もう一度押すと閉じるというようなトグルボタンを設置する時、メニューを開いた状態で画面のどこかをクリックすると、メニューが閉じるという仕様になっている事が多い。 そこで自分も、 […]
通常は、CSSで、width: 100vw; height: 100vh;とすれば、その要素は全画面になりますが、これをjavascriptで行いたい時があったので、メモ。 $(window).on(‘load resi […]
以下のようなonloadイベントが、IEでだけうまく動かなかったので、メモ。 ちなみに、この状態だと両方とも動きます。 ・・・の所へいろんなスクリプトが入った状態だとIDが定義されていませんというエラーで動きませんでした […]
ページを読み込んだら、すぐに実行する関数、それぞれ実行するタイミングや動作が違う。 短縮形なども含めると結構たくさんあるので、まとめてみました。 JavaScript window.onload = … window.o […]
ホームページにグラフを描きたいなと思って、ちょっと検索してみたら意外と簡単な方法で実現できたのでご紹介。 Chart.jsという便利なライブラリーがあり、これを使えば簡単にブラフを描く事ができます。 HTML5から採用に […]
お客様のビジネス目標を達成するための最適なご提案をいたします。初回相談は無料ですので、まずはお気軽にお問い合わせください。