zenet_logo

-株式会社ゼネット技術ブログ-

html

HTML5 date型に存在しない日付を入力したときにはまった話

お久しぶりです。阿部です。 HTML5のdate型の項目で、存在しない日付に対するバリデーション処理にはまった話を書きたいと思います。 <input type="date" id="date"> と要素を作成し、javascriptで入力値を取得し入力チェックを行う処理を実装していました。 let date_value = document.ge…

HTML5のdatalistを使って、IE11で部分一致させる。

システム事業部の三浦です。 HTML5で追加された、datalistのちょっとしたクセについて紹介したいと思います。 TL;DR IEでdatalistを部分一致で引っ掛けたい場合は、 datalist-polyfillを利用すると簡単 本題 HTML5より導入された、inputのlist属性とdatalist…

追従型メニューの作り方

システム事業部の五十島です。 今回は追従型メニューについて説明していきたいと思います。 追従型メニューとは、スマホサイトでよく見る『スクロールしても画面上に表示されているメニューや広告など』になります。 ちょっと難しそうと思うかもしれませんが…

CSS Grid Layoutのすすめ(パート2)

こんにちは。システム事業部の五十島です。 前回の記事に引き続き CSS Grid Layoutのご紹介です。 前回はただ単に並べただけで、float: leftl; float: right とあまり大差がないように感じたと思いますが、 今回は任意の位置に表示する手法を説明していきま…

HTMLとjavascriptを利用し、アップロードする動画ファイルの再生時間をクライアント側で取得する方法

こんにちは。システム事業部の三浦です。 最近動画のアップロードをする入力フォームを作る機会がありました。 アップロード可能な動画ファイルの条件として、再生時間が300秒以内という条件がありました。(ファイル形式他諸々もチェックしましたが、今回は…