読者です 読者をやめる 読者になる 読者になる

TechNote

とあるエンジニアのただのメモ

jQuery

jQuery セレクトボックスである値を選んだときだけテキストボックスを有効化する方法

今後もよく使いそうなのでメモ。 photo credit: "Cowboy" Ben Alman via photopin cc var show_width = document.documentElement.clientWidth; if (show_width >= 480) { // 表示領域が480ピクセル以上の時(PC用) document.write(""); google_ad_client = "…

jQuery removeとemptyによるDOM要素削除方法の違い

覚えておきたいのでメモ。 jQueryでDOM要素の削除方法は2通りある。 photo credit: Johannes_wl via photopin cc var show_width = document.documentElement.clientWidth; if (show_width >= 480) { // 表示領域が480ピクセル以上の時(PC用) document.writ…

これはホントに使える!「お待ちください(Now Loading..)」画面を半透明レイヤーでいろどるjQuery.BlockUI.jsの使い方いろいろ

サマリー 1.jQuery.BlockUIとは 2.使い方 3.画面がready状態になる前に表示させたい場合 4.使用してみた感想 photo credit: Arttu Ekholm via photopin cc var show_width = document.documentElement.clientWidth; if (show_width >= 480) { // 表…

最も簡単なテーブルのページネーション用プラグイン jQuery.TablePagenationを使ってみた

検索画面や一覧画面にはページネーションがあったほうが便利だが、数年前に一度自前でページネーションを実装した際に結構ゴチャゴチャと大変な思いをした記憶があったため、このところはページネーションはつけないことにしていた。今回どうしてもつける必…

指定範囲を簡単に印刷するjQueryプラグイン jPrintArea.js が便利な件

Webサイトの印刷機能をつくるのに最も手軽なjQueryプラグインjPrintAreaを使ってみたのでメモ。 photo credit: driek via photopin cc サマリー 1.指定範囲を簡単に印刷するjQueryプラグインjPrintArea.jsとは 2.使ってみる 3.感想 var show_width = d…

jQuery UI を無駄なく使いこなすために必要な知識まとめ(各ファイルの役割など)

jQuery UIは、インタラクティブなWebサイトを開発するために使用されるjQueryベースのUIライブラリです。このため、多くのサイトで「簡単」「手軽」などというキャッチを用いて紹介されています。 ところが、どのファイルがどのような役割を持っているかを正…

jQueryで簡単にテキストボックス内に透かし文字の補足を入れる方法

入力前はテキストボックス内に説明文がうっすらと見えた状態で、クリックすると説明文が消えるというアレを社内システムに実装してみたのでメモ。親切なUIを実現するために欠かせない小技の一つです。 var show_width = document.documentElement.clientWidt…

jQueryでオシャレかつ機能的なフォーム画面を実装 formly.js

社内システムだったら必ずフォームのPost送信は多用するし、Webサイトであっても入力画面が存在するところには必ずフォームは必要となる。そんなとき、簡単にオシャレで機能的なフォームが設置できたら重宝するだろう。bootstrapなどのcssフレームワークを使…

jQueryでスライダー機能を実装 - 横幅いっぱいのスライダーFullWideSlider

以前のエントリー jQueryでスライダー機能を実装 - jQuery slider2 で、jQueryスライダー設置の練習が済んだところで、少々本格的な「横幅いっぱい」のjQueryスライダーを設置してみたのでメモ。 実践Webデザイン jQuery+CSSフレームワークでサクサクつくる…

jQueryでスライダー機能を実装 - jQuery slider2

昨今のWebサイトのトップページでよく見かけるスライダーを自社Webサイトに実装してみたときの試行錯誤をメモ。スライダー初使用のため、入門編としてjQuery slider2をテスト環境で使用してみた。 Webデザイナーのための jQuery入門 魅力的なユーザーインタ…

BootStrap 向けのdatepickerによるカレンダー実装は簡単便利 だけどieには不向きか

BootStrap向けのdatepickerによるカレンダー実装が簡単かつ便利だったので使用方法をメモ。 var show_width = document.documentElement.clientWidth; if (show_width >= 480) { // 表示領域が480ピクセル以上の時(PC用) document.write(""); google_ad_clie…

jQueryUI の Datepicker によるカレンダー機能実装が簡単便利

今更ながらjQueryUIのDatepickerが簡単かつ便利だったので実装方法のメモを残す。 var show_width = document.documentElement.clientWidth; if (show_width >= 480) { // 表示領域が480ピクセル以上の時(PC用) document.write(""); google_ad_client = "ca-…

jQueryで簡単にメッセージをスーッと消す setTimeoutの実装方法

Web上でときどき見る「登録しました」などのメッセージ表示エリアがスーッと消えてなくなる動きを自分もやってみた。簡単ながら社内システムなどで今後も使えそうなのでメモ。 業務アプリの多くがDBにデータいれて、取り出して、表示...という単調な部分が多…

jQueryで簡単にフワッと画像を表示させる lazyload.jsの実装方法

よくWebサイト上で見かける、画面をスクロールしていくとフワッと画像が現れてくるあの小技です。いつか自分も使う機会があったら使ってみようと思っていましたが、本日社内システムの一部で使うことになったので使い方をメモ。簡単ながら、なかなか使えそう…