IDEA * IDEAドットインストール代表のライフハックブログ
オンラインで綺麗にJavaScriptのコードを整形できる「Online javascript beautifier」:phpspot開発日誌
オンラインで綺麗にJavaScriptのコードを整形できる「Online javascript beautifier」。 WEBで拾ったソースコードがインデントされていなかったり、ブックマークレットを読むような場合に使えます。 若干不具合あるようですが、自分でコードを元に戻すのに比べるとはるかに楽ですね。 タブを変換したりも出来るみたいです。 以下のエントリを参照してください。 Online javascript beautifier
画像にオーバーレイのキャプションをつけられるjQuery – creamu
Quenessで、jQueryを使って画像にオーバーレイのキャプションをつけるサムネイルギャラリーの作り方が紹介されています。 ソースは以下のようになっていて、とてもシンプルですね。 <div class="photo"> <div class="heading"><span>Pier</span></div> <img src="images/pier1.jpg" width="300" height="186" alt="" /> <div class="caption"><span>Lorem de scua shemf huan rougt ecrit vato de souju kanasa.</span></div> </div> 画像にマウスオーバーすると、トランジションでキャプションが表示されます。 ぜひ見てみてください♪ » Create a Thumbnail Gall
新はてなブックマーク件数取得 API を使って自分のページに件数を埋め込む最も簡単な方法 - IT戦記
はてなブックマークから新しい件数取得 API が提供されているようです！ (開発者さま向け)はてなブックマーク件数取得APIに新しいAPIを追加 - はてなブックマーク日記 - 機能変更、お知らせなど この API のいいところは JSONP に対応しているところでしょうね！ すばらしい！ というわけで、 HTML だけで、件数を埋め込む例を書いてみたよ！ やり方は簡単 callback パラメータに document.write を指定するだけ！ <script src="http://api.b.st-hatena.com/entry.count?url=http%3A%2F%2Fwww.example.com%2F&callback=document.write"></script>件のブックマークがあります。 あとは、適当にリンクとか張って <a href="http://b.ha
入力中に今のフィールドが何文字制限なのか分かりやすく表示できるjQueryプラグイン「Input Limiter」:phpspot開発日誌
入力中に今のフィールドが何文字制限なのか分かりやすく表示できるjQueryプラグイン「Input Limiter」 2009年07月24日- Input Limiter 入力中に今のフィールドが何文字制限なのか分かりやすく表示できるjQueryプラグイン「Input Limiter」。 通常は、このフィールドは何文字以内などと書いておいて、サブミット後にチェックという方式だと思いますが、Input Limiter を使えば、入力が始まると同時にヒントが現れ、フィールドが何文字制限なのかというのをポップアップしてくれます。 デモページ 横にちょこっと表示するよりも、入力している人にとっては非常に分かりやすい見せ方ですね。 $(function() { $('textarea').inputlimiter({limit: 100}); }); jQueryプラグインということで初期化も上記のよ
faviconを表示するjavascript「Hyperlink Cues with Favicons」
twitter facebook hatena google pocket 最近のブラウザにはfavicon（favorite icon）と呼ばれるブックマークやアドレス表示欄、タブなどに表示されるアイコンがあります。 サイトを識別するため、目立つためなどさまざまな目的で使用されています。 Hyperlink Cues with Faviconsでは、リンクさせた外部リンクの全て前にこのfaviconを表示させるjavascriptを公開しています。 sponsors 使用方法 favicon.jsとfaviconを使用していないサイト用にexternal.gifをダウンロードします。 <script src="http://yourdomain/favicon.js" type="text/javascript"></script> <style type="text/css"> img
JavaScriptから簡単に使えるFlashビデオプレイヤー「Flowplayer」:phpspot開発日誌
Flowplayer - Flash Video Player for the Web JavaScriptから簡単に使えるFlashビデオプレイヤー「Flowplayer」。 FlashビデオプレイヤーをJavaScriptから再生、停止させたりすることが簡単にできちゃいます。 使い方は無茶苦茶簡単です。 // id="player" の div に動画を埋め込みます。"my-video.flv"を再生します $f("player", "flowplayer.swf", "my-video.flv"); // プレイヤーのバージョンを得ることもできます $f("player").getVersion(); // 再生の制御をすることもできます $f(0).play(); // 停止の制御をすることも可能 $f().stop(); FlowPlayerのAPIリファレンス 動画をとって f
jQueryとCSSで驚きのページめくり効果を作るサンプル:phpspot開発日誌
Simple Page Peel Effect with jQuery & CSS jQueryとCSSで驚きのページめくり効果を作るサンプル。 利用者に対して驚きを与えるだけでなく、スペースも有効に使える便利なサンプルが公開されていました。 綺麗なアニメーションをするも、Flashは使っておらず、jQueryとCSSで表現されているところが凄くてそのテクニックにも注目。 以下のようなＵＩがあります。 右上のめくったところにカーソルを合わせるとペローンとページがめくられ、少ないスペースだったのに情報が表示されます。 該当のコードですが、以下のように、jQueryのanimateによって実現されています。 $("#pageflip").hover(function() { //On hover... $("#pageflip img , .msg_block").stop() .animat
テキスト内容によってtextareaを自動リサイズできるjQueryプラグイン「autoResize」:phpspot開発日誌
テキスト内容によってtextareaを自動リサイズできるjQueryプラグイン「autoResize」 2009年03月10日- jQuery plugin: ‘autoResize’ - James Padolsey テキスト内容によってtextareaを自動リサイズできるjQueryプラグイン「autoResize」 改行を入れると、textareaが自動でズイズイとアニメーションで伸張します。 「textareaのサイズを入力にあわせて調整するＪａｖａＳｃｒｉｐｔ 」というのがありましたがアニメーションできる＆jQueryプラグイン＆オプション指定可能という点があります。 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 設置サンプル 設置のサンプルです。 設置のサンプルです。 設置のサンプルです。 以下のようなオプションが指定出来ます。 ・onResize でコールバック関数を指定 ・animate
ホームページ - Programming Magic
オンラインカジノゲームで遊んで時間を潰したいだけであれば、お気に入りのゲームがどんな手順で作られたのかなど、考えたこともないでしょう。しかし、どのゲームもすべてプログラミングから始まっており、プラットフォーム全体を動かすソフトウェアの作成から始まるのです。 プログラマーは、ユーザーが楽しく本格的なゲームをプレイできるよう、コードを設計し、グラフィックを制作しています。言ってみれば、プログラマーがいなければ、オンラインカジノゲームは存在しないのです！では、このプログラミングという作業がオンラインギャンブル業界にどんな影響を与えているのか見てみましょう。 ゲーミングソフトウェア パソコンの前に座ったり、スマホをいじったりしている時は、ゲームを作るためにどれだけの労力が注ぎ込まれているのかなど気にしないものです。しかし、家に居ながらにしてカジノゲームにアクセスすることができるのは、ゲーミングソフ
特定の要素の中身をごっそり書き換える方法 - JavaScript TIPSふぁくとりー
《2017年6月8日 5:00 PM 公開/更新》 特定の要素の中身をごっそり書き換える方法 [装飾・内容変更] JavaScriptを使って特定のHTML要素の内容をごっそり丸ごと違う内容に書き換えるには、innerHTMLプロパティの値を書き換えるだけです。とても簡単に要素の中身を丸ごと異なる内容に変化させられます。JavaScriptで生成した何らかのデータを動的にウェブ上に表示する際によく使います。 特定の要素の中身をごっそり丸ごと書き換える方法 特定の要素の中身を丸ごと全部書き換えるJavaScriptの書き方 特定の要素の中身を丸ごと全部書き換えるJavaScriptの例 特定の要素の中身をごっそり丸ごと書き換える方法 JavaScriptを使うと、特定のHTML要素の中身をごっそりまるごと動的に書き換えることができます。装飾を変更するレベルではなく、表示されている内容を何もか
ウィンドウ名.prompt()－JavaScriptリファレンス
windowオブジェクトのprompt()メソッドは、文字入力ダイアログを表示します。 ユーザーがテキスト入力欄に何か記入して［OK］ボタンを押した場合には、その入力内容が返ります。 ユーザーが［キャンセル］または［×］ボタンを押した場合には、 null が返ります。 ユーザーは［OK］［キャンセル］［×］のいずれかのボタンをクリックしてダイアログを閉じるまで、次の処理に進んだりブラウザを操作することはできません。 ダイアログに表示されるテキストを改行する場合には\nを、タブを入れて字下げする場合には\tを記述します。 ■構文・引数・戻り値 構文 ウィンドウ名.prompt("メッセージの内容", "テキスト入力欄に表示される初期値") 戻り値 ユーザーが入力したテキスト内容、または、null HTML + JavaScriptソース <script> function sample()
Web制作会社が作った！超使えるJavaScriptライブラリ (1/2)
「Webサイトを作るときに本当によく使う機能を、自分で作らずにさくっと実装したい」――。そんなワガママな願望をかなえてくれる JavaScriptライブラリが登場した。ミツエーリンクスが今月オープンソースとして公開した「MJL（MITSUE-LINKS JavaScript Library）」は、Webサイト制作に必須の“最小限の機能”に絞ったJavaScriptライブラリだ。 昨今相次いで公開されている、リッチなUIを実現するJavaScript/Ajaxライブラリとは異なり、MJLの機能はとてもシンプルだ。もともとWeb制作会社であるミツエーリンクスが「自社標準ライブラリ」として作成したものだけあって、汎用性・実用性を重視したライブラリになっている。 具体的な機能は以下の6つ。確かにどれもよく使いそうなものばかりだ。 画像のロールオーバー Flashオブジェクト埋め込みの機能拡張 新規
JavaScript読み込みブロック回避でページ表示を高速化する方法 | エンタープライズ | マイコミジャーナル
スクリプトが読み込まれるまで画像の読み込みがブロックされている - 同ブログより抜粋 WebページパフォーマンスツールであるYSlowの主要開発者でありYahoo! Exceptional Performanceの開発者であるStoyan Stefanov氏がNon-blocking JavaScript Downloadsというタイトルで、ページの読み込み速度を向上させるテクニックを簡潔にまとめている。これはブロックが発生するJavaScriptの読み込みを並列化することでページの読み込み時間を短縮しようというもの。Webページの読み込み高速化に効果的な手法なのでWebデベロッパは一度目を通しておきたい。 JavaScriptの読み込み中はほかの読み込み処理がブロックされる。これをDOM経由で動的にロードするように書き換えてやれば並列して読み込まれるようになる。Non-blocking
Google人気JavaScriptライブラリ配布開始、ネット全体でキャッシュ効果 | エンタープライズ | マイコミジャーナル
GoogleからGoogle AJAX APIを拡張する新しいサービス「The AJAX Libraries API」が公開された。The AJAX Libraries APIはGoogleのサイトで人気のある有益なJavaScriptライブラリを提供しようというもの。これまでYUIであればYahoo!、DojoであればAOLなどが同類のサービスを提供していたが、特定のJavaScriptライブラリに限定することなく有益であれば配布に追加するというポリシーをもっている点が新しい。 JavaScriptライブラリを活用するタイプのWebアプリケーションは数多くある。結果として、何度も似たようなJavaScriptライブラリをダウンロードしていることになり、このままいけば今後ライブラリ自体のサイズの巨大化や多くのサービスの登場でライブラリダウンロード総量は増加することになる。 The AJAX
404 Blog Not Found:javascript - 勝手に添削 - textareaの高さを自動調節
2008年05月20日14:15 カテゴリLightweight Languages javascript - 勝手に添削 - textareaの高さを自動調節 これはなかなかいいですね。 textareaのサイズを入力にあわせて調整するＪａｖａＳｃｒｉｐｔ (イラストdeブログ開発記) イラストdeブログの掲示板の使い勝手を高めるため、textareaサイズをJavaScriptで改行入力毎に大きくするコードを書いてみました Firefox 2, Safari 3, Opera 9で動作確認してあります。 イチ に 三 function resize_textarea(ev){ //if (ev.keyCode != 13) return; var textarea = ev.target || ev.srcElement; var value = textarea.value; var
[Think IT] 【これならわかる！JavaScript/Ajax】やりなおしのJavaScript 第1回：そろそろ本気で学びませんか？ (1/3)
画面の一部を瞬時に切り替える方法 JavaScriptを勉強したいけど、プログラム構造がよく分からなくて、なんとなく使っている人は多いのではないかと思います。市販の本やWebサイトにはJavaScriptのサンプルがたくさん載っているので、必要なところをコピー＆ペーストしてしまうと、JavaScriptの文法が分からなくても動いてしまいます。 しかし、このような使い方をしていると、JavaScriptサンプルを少しだけ修正したいという時に対応できなくなります。これでは「JavaScriptを使える」とは言えませんよね。 そこで、本連載では、JavaScriptをもう一度やり直したい方々のために、勉強の切り口を変えて紹介していきましょう。 最初のトピックでは、JavaScriptを使ってHTMLのコンテンツを入れ替える方法について紹介してます。この技術は、最近話題になっているAjaxのベース
IE6 と IE7 と IE8 を同じマシンで共存させる方法 - IT戦記
追記： 現在は IETester というソフトウェアを使うのがベストだと思います＞＜ 結論から言うと Jeremy Smith's blog: Success! IE 6, 7, and 8 Running on Same Machine (Plus 5.5 and 5.01) に書いてある通りで IE8 をインストール http://tredosoft.com/IE7_standalone の IE7 Standalone をインストール http://tredosoft.com/Multiple_IE の Multiple IE をインストール の順で、共存させることができました。 IE8 を入れるのを戸惑っている人は 入れてみたらいかがでしょうか。 ちなみに 以下のサイトからダウンロードできる Standalone IE6 は IE8 と共存できませんでした。 browsers.ev
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.wktklabs.com/flexplayer/
http://hysysk.s369.xrea.com/sketch/p5js/seq/seq.html