JavaScript JavaScriptで解像度からアスペクト比を算出する 今朝ツイッターを眺めていたら、10.8型のモバイルノートで解像度が2560×1600のノートパソコンのレビューが流れてきたんですけど、アスペクト比がパッと思い浮かびませんでした。 横2560pxで縦1440pxならぼくが使っている31... 2022.02.09 JavaScript
JavaScript JavaScriptでTABLEにソート機能を実装する(jQuery不要) jQueryもそのプラグインも、外部ライブラリも使わず、自前で書いたJavaScriptでTABLEタグをソートするプログラミング例の紹介と解説です。 配列のソート機能はJavaScript自体が持っているので、あとはDOM操作だけで... 2022.02.07 JavaScript
JavaScript Excelみたいな表入力はcontentEditable属性で簡単に実装できる 今から14~5年前のこと、業務用のWebシステムで、ユーザーが Microsoft Access※ のように自由に入力フォームをデザインできるようにしてほしい、という無茶ぶりをされたことがあります。 ※あるいはLotus Notesのよう... 2022.02.04 JavaScript
JavaScript JavaScriptで任意の要素の座標取得/要素移動/スクロール 「JavaScriptでのページ内スクロールとDOCTYPE宣言でハマった話」の続きみたいなものですが、今回はページ最上部/最下部へのスクロールではなく、任意の要素位置へのスクロールについてサンプルを交えて語ってみたいと思います。 w... 2022.01.31 JavaScript
JavaScript JavaScriptでのページ内スクロールとDOCTYPE宣言でハマった話 ページ内のスクロール処理、例えばボタンやボタンは様々なWebサイトで見られますが、実装方法はいろいろと異なりますし、特定の要素を指定したスクロールについては少しややこしいので、そのあたりの解説を記事にしよう……………………と思っていまし... 2022.01.29 JavaScriptトラブル事例
CSS 簡単なJavaScriptとCSSで横並びプルダウンを自作する Web上の入力フォームにおいて、よく使われるプルダウンのお話です。 つい先日も、「PHPで日付の表記ゆれを修正する例」で選択肢が多い場合のプルダウン※の使いづらさについて少し触れました。 ※VB等のプログラミング上はドロップダウンリ... 2022.01.28 CSSJavaScript
JavaScript JavaScriptで無限スクロールを実装するのはとても簡単(jQuery不要) ある意味、前回の「JavaScriptとCSSを使ったスライドショーで画像を遅延ロードする方法」と関連するのですが、最後までスクロールしたと思ったら、スクロールバーが増えて画像が追加された!みたいなページってあるじゃないですか。 あれ... 2020.08.19 JavaScriptプログラミング
JavaScript JavaScriptとCSSを使ったスライドショーで画像を遅延ロードする方法 すまない、”また”スライドショーの話なんだ。 最初に投稿した「JavaScriptでスライドショーみたいな画像切替え(jQueryなし)」ではJavaScriptのsetTimeout関数、およびCSSのdisplayプロパティのno... 2020.08.18 JavaScriptプログラミング
JavaScript JavaScriptとCSSで画像をふわっと切り替えるスライドショーを作る 以前、「JavaScriptでスライドショーみたいな画像切替え(jQueryなし)」と題してスライドショーは作ったのですが、CSSは使っておらず、フェードイン/アウトのようなトランジション処理も入っていなかったため、見栄えがいまいちかなぁー... 2020.08.17 JavaScriptプログラミング
JavaScript JavaScriptで写真の上を自由に動かせる注釈を作ってみる 以前、「CSSでクリッカブルマップのように画像へ注釈を入れる例」という記事で、画像の上に注釈を表示する例を紹介しました。 今回はその注釈テキストをJavaScriptを使って、自由に追加/編集/移動/削除ができるようにしたら楽しいので... 2020.07.31 JavaScriptプログラミング