Windows向けMySQL管理クライアント「HeidiSQL」
Windows向けのMySQL管理クライアント「HeidiSQL」を紹介します。 HeidiSQL １．概要 「HeidiSQL（ハイディSQL/ハイジSQL）」はWindows向けのオープンソースソフトウェアです。 MySQLのクライアントといえば「phpMyAdmin」が有名ですが、たとえばローカルなMySQLを操作するのであればクライアントソフトの方が設定が簡単です。 ちなみに、HeidiSQLはSSHで接続することも可能なので、SSHの設定さえできればサーバ上のMySQLの操作も可能なようです。 ２．ダウンロード HeidiSQLのページにアクセスして「Downloads」をクリック。 ここでは「Portable（zip版）」をクリックします。 ダウンロードしたアーカイブを任意のフォルダで展開すればインストールまで完了です。 ３．データベース接続の設定 「heidisql.exe」
jQuery.ajax()のまとめ
jQuery.ajax()について逆引きリファレンスっぽくまとめてみました。 まとめた理由は、ネットで「jQuery.ajax」や「jQuery.ajax サンプル」などで調べても、いい感じの内容がなかなかヒットしないことと、よくヒットするサイトの情報が古かったりする（1.4で止まっているとか）ためです。 ということで、2012年10月現在2014年10月現在の「jQuery.ajax()」などをざっと調べて作ってみました。 初心者向けの内容です。すべてのオプションは網羅できていません。とりあえずサンプルコードがほしい方は１５項をご覧ください。 若番から必要と思われるものを順番に並べているつもりですが、後半は適当です。また、各項のサンプルはなんとなく積み上げていく感じにしています。 調べている間にも3つくらい新しい発見（といっても古い情報ですが…）があり、jQueryが日々進化していること
pre要素で折り返しをするためのCSS
pre要素でソースコードを折り返すためのCSSです。最近は色々なSyntax Highlighterが登場しているので必要ないかもしれませんが、URLなどの横に長い文字列をpre要素で表示したいときに有効かもしれません。 １．CSS 以下のCSSでpre要素の文字が折り返せます。「white-space: pre-wrap」または「word-wrap: break-word」に未対応のブラウザはoverflowプロパティでスクロールします。 pre { white-space: pre-wrap; word-wrap: break-word; overflow: auto; } 以下は、過去の記事でよくみかけた設定です。 pre { white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; w
JavaScriptのsetTimeout()のまとめ
JavaScriptのsetTimeout()の使い方についてまとめてみました。 まとめているのは基本的なことのみですので、さらに詳しい内容については参考記事等を参照願います。 認識誤りがありましたらどこかでつぶやいてください。 １．setTimeout()の機能は？ タイムアウトした時点で、パラメータに指定した処理を1度だけ実行させるための関数です。 ２．setTimeout()のパラメータは？ 第1パラメータに起動したい処理または関数、第2パラメータにタイムアウト時間（＝第1パラメータで指定した関数または処理を起動させるまでの待ち時間）をミリ秒で指定します。 setTimeout( 起動したい処理または関数, タイムアウト時間 ); ３．setTimeout()の返却値は？ タイマーIDが返却されます。タイマーIDは単なる整数です。 var timer_id = setTimeout(
jQueryで遅延ロードを汎用的に実現する「ScrollTrigger」プラグイン
jQueryで遅延ロード（遅延読み込み）を汎用的に実現する「ScrollTrigger」プラグインを紹介します。スクロールで要素が表示されたときに任意の関数を実行できます。 当ブログでも、記事ページ本文下にあるソーシャルブックマークボタンとFacebookのLikeBoxの表示にこの仕組みを使っています。 １．目的 Facebookの「いいね！」ボタンなど、最近ソーシャル系のパーツをブログなどに表示している方が少なくないと思います。 ですが、パーツの表示にはJavaScriptを使っているものがほとんどで、そのまま設置するとページのロード時間が遅くなるケースが多く、結果的にページ表示時間に影響することになります。 本プラグインは、そういったソーシャル系のJavaScriptのロードを遅延させることができ、初回のロード時間を短縮したいときに効果があります。 ２．機能 ページをスクロールして、
TwitterやFacebookのように一番下までスクロールしたら自動的にコンテンツを表示する「jQuery.Bottomプラグイン」
TwitterのタイムラインやFacebookのニュースフィードように、ページの一番下までスクロールしたらコンテンツを自動的に表示する「jQuery.Bottomプラグイン」を紹介します。 １．サンプル jQuery.Bottomプラグインにはデモページが用意されていますが、いまいちなのでサンプルページを作りました。 jQuery.Bottomプラグインサンプル ページの一番下までスクロールすると自動的にコンテンツを表示します。 なお、最初に表示した状態でコンテンツがすべて表示されてしまっているとそもそも動作しないので注意してください。 ２．プラグインの機能 jQuery.Bottomプラグインは「bottom」イベントを登録するためのものです。このイベントを利用してページの一番下までスクロールすれば、bottomイベントが発生します。 ３．プラグインのダウンロード githubのjQue
HTMLやCSSでのプロトコル表記（http:、https:）の省略について
HTMLやCSSではプロトコル表記（http:、https:）の省略が可能です。 ということで、プロトコル表記の省略に関することを色々調べてみましたので、本エントリーで紹介致します。 このエントリーは、「「Google HTML/CSS Style Guide」を適当に和訳してみた」の以下の部分に対しての便乗記事です。 埋め込みリソースからプロトコル表記（http:,https:）を省略する。 <!-- Not recommended --> <script src="http://www.google.com/js/gweb/analytics/autotrack.js"></script> <!-- Recommended --> <script src="//www.google.com/js/gweb/analytics/autotrack.js"></script> １．プロトコ
Movable Typeの画像アップロード時にリサイズできる「UploadImageResizerプラグイン」
Movable Typeの画像アップロード時にリサイズ可能な「UploadImageResizerプラグイン」を公開します。 １．機能 アイテムのアップロード画面で画像をアップロードする際、「アップロード画像オプション」をチェックします。 チェックすると、アップロード画像をリサイズするためのオプションが表示されます。各フィールドに値を設定してアップロードすれば、指定したサイズでアップロードされます。 このプラグインは、アップロード後の画像をリサイズするのではなく、アップロード時にサイズ指定するものです。アップロード後に画像をチェックしながらリサイズしたい場合は、インターネットに接続された環境であれば「Pixenateプラグイン」を推奨します。 Movable Typeでアイテム画像を編集できる「Pixenateプラグイン」 また、UploadImageResizerプラグインは画像の拡大は
Highslide JSの動作やスタイルを簡単に設定できる「Highslide Editor」の徹底解説
ウェブサイトに掲載するサムネイル画像の拡大には「Highslide JS」が非常に便利ですが、多機能なせいか、動作やスタイルの指定が結構面倒です。 それらを解消するための「Highslide Editor」がいつの間にかリリースされていたので、利用方法を本エントリーでがっつり紹介します。 Highslide Editor １．概要 ここでは「Highslide Editor」の使い方に関するおおざっぱな流れを説明します。詳細な機能については２項で説明します。 「Highslide JS」の左メニューにある「Editor」をクリック。 「Welcome to the Highslide Editor」の画面が開くので、下にある「Get started!」か右上の×印をクリック。 左ペインで各種設定を行います。左ペイン上部のタブで設定項目を切り替えます。左ペイン上部の「Get link」は現在
Movable Typeのカスタムフィールドを一覧画面で編集できる「ListingFieldEditorプラグイン」
Movable Typeのカスタムフィールドを一覧画面で編集できる「ListingFieldEditorプラグイン」を公開します。 １．機能 カスタムフィールドのデータを一覧画面で編集できます。保存はAjaxで行います。 編集イメージ 編集可能なフィールドは以下の通りです。今後さらに拡張する予定です。 テキストフィールド テキストエリア ラジオボタン ドロップダウン チェックボックス 画像 複数のカスタムフィールドを同時に編集することも可能です。 以下の一覧画面に対応しています。 ブログ記事 ウェブページ コメント アイテム ユーザー また、藤本さんが開発されたAnotherCustomFieldsプラグインにも対応しています。 ２．プラグインのダウンロード ListingFieldEditorプラグイン専用のページを開設しましたので、そちらからダウンロード願います。 ListingFie
WordPressの「続き」をjQueryで折りたたむ「wp_more_content_folder」プラグイン
WordPressの「続き」をjQueryで折りたたむ「wp_more_content_folder」プラグインを公開します。 閉じた状態 開いた状態 １．機能 本文の追記部分をjQueryを使って折りたたみします。このプラグインは「Show Hide "more" with WordPress」を改造したものです。 サンプル ２．ダウンロード 以下のリンクからプラグインをダウンロードしてください。 変更履歴 2011.05.09 初版 2011.05.09 v0.2 jQueryの呼び出し方法変更／本文下に表示される「閉じる」をクリックしたときの折りたたみ速度修正 wp_more_content_folder_0_2.zip アーカイブを展開し、中にあるwp_more_content_folderフォルダをpluginsディレクトリにアップロードしてください。 アップロード後、管理画面で
サイト全体で未使用のCSSセレクタを見つけるFirefoxアドオン「Dust-Me Selectors」
不要なCSSセレクタを見つけてくれるFirefoxアドオン「Dust-Me Selectors」を紹介します。 古くからあるアドオンなのでご存知の方も多いかと思います。ページ単位のチェックができる他、サイトマップを使って、サイト全体で使っていないCSSセレクタを見つけてくれる機能もあるようです。 １．インストール 「Dust-Me Selectors」のページにアクセスして、「Continue to Download」のリンクをクリックすればダウンロード画面が表示されます。 Dust-Me Selectors 2011年5月現在では、Firefox4には対応していないようです。Firefox4にインストールしたい場合は「Firefox4で動作しないアドオンを動作させる方法」を試してみてください。 2012年6月現在、最新のFirefoxに対応しています。 ２．ページ単位のチェック ページ単
WordPressの記事に挿入した画像のサムネイルを表示する「QF-GetThumb プラグイン」
WordPressの記事に挿入した画像のサムネイルを表示する「QF-GetThumb プラグイン」について紹介します。 １．プラグインの機能 プラグインを適用することで、記事に挿入した画像から自動的にサムネイル（キャッシュ）を生成します。 1つの記事に対して作成するサムネイルは1つだけです。記事中に複数の画像がある場合、何番目の画像をサムネイルにするか、指定することもできます。 ２．ダウンロード・インストール QF-GetThumbのページ右にある「Download Version 1.1.3（2010年9月現在のバージョン）」をクリック。 ダウンロードしたアーカイブを展開して、中にある「qf-getthumb」フォルダをwp-content/pluginsディレクトリにアップロードします。 管理画面左メニューの「プラグイン」をクリックして、次の画面で「QF-GetThumb」の「有効化」
リンク画像の枠線を消す
バナー等の画像にリンクを設定すると青い枠が表示されます。これをCSSを使って消去する方法を何通りかご紹介します。 消去前 消去後 １．スタイルシート（styles-site.css）に設定 まず、タイプセレクタで img 要素に枠線を与えない設定を行います。 img { border-style:none; } または、子孫セレクタで a 要素の子孫要素である img 要素に設定を与える方法です。上記の場合は全ての画像にスタイルが適用されますが、この方法であればリンク画像のみにスタイルの設定を与えることができます。 a img { border-style:none; } さらに、img 要素に class 属性 または id 属性を与えて、クラスセレクタ・一意セレクタで指定すれば画像によってリンクのあり・なしを振り分けることができます。以下はクラスセレクタの例です。 .no_border
小粋空間_カテゴリーリストにカスタムフィールドの画像を表示する
Finaleで2音のトレモロを入力する方法を紹介します。 なお、米国時間2024年8月26日、Finaleの開発/販売終了がアナウンスされました。 国内販売代理店契約の即日終了に関して １．問題点 Finale（バージョン27）で冒頭のような2音（またはそれ以上）のトレモロを入力したいのですが、方法がわかりません。 ということで、Finaleで2音のトレモロを入力する方法を紹介します。 ２、Finaleで2音のトレモロを入力する 2音のトレモロを入力するには、トレモロさせたい音符を選択。 メニューバーより「プラグイン」→「TG Tools」→「簡易トレモロ...」を選択。 ダイアログが開くので、連桁（れんこう）の本数等を指定して「適用」をクリック。ここでは「2」を設定します。連桁とは連続した音符の旗をつないで記述することです。 これで2音のトレモロが設定できたので、ダイアログの「閉じる」ま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
