タグ

2017年5月9日のブックマーク (2件)

  • jQuery Snippets #10 - NxWorld

    基礎的なものからちょっとした機能の実装方法など、jQueryに関する個人的なメモ・スニペットリストの第10弾です。 動きをすぐ確認できるデモなどは基的に用意していないので、実際の動きを確認したい場合などは自身で簡単な環境を作成して試してもらうか「CodePen」や「JSFiddle」などを利用して確認してください。 ul要素内のli要素を分割する ul要素内にあるli要素を指定した数に分割するという動きを実装するもので、何分割するかはul要素に記述してあるdata-colsというdata属性で指定します。 下記サンプルコードのHTMLをそのまま使用した場合は「li要素を3つのul要素に分割させる」という動きになり、1〜4がひとつ目、5〜7がふたつ目、8〜10がみっつ目として分割されて、それぞれが異なるul要素で括られます。 また、jQueryの一番下ではもともとあったul.split-l

    jQuery Snippets #10 - NxWorld
  • jQuery Snippets #9 - NxWorld

    基礎的なものからちょっとした機能の実装方法など、jQueryに関する個人的なメモ・スニペットリストの第9弾です。 動きをすぐ確認できるデモなどは基的に用意していないので、実際の動きを確認したい場合などは自身で簡単な環境を作成して試してもらうか「CodePen」や「JSFiddle」などを利用して確認してください。 セレクトボックスを連動させる 地域選択のセレクトを選択すると都道府県のセレクトが選択可能になり、さらに地域選択で選択されたものによって都道府県選択の中身を変更するという動きを実装する方法です。 ブラウザによっては単純にdata属性の値をチェックして.show()と.hide()使って表示・非表示の切り替えとかで実装できるのですが、Safariなど一部ブラウザではそれだと実装できない(不要な項目を非表示にできない)ので、下記のようにわざわざデフォルトの値を取得したり.remove

    jQuery Snippets #9 - NxWorld