[ホームページ作成] All About｜HP制作の基礎や便利な情報を解説ホームページ作成ホームページ作成の超基本から、スタイルシート（CSS）の作成や活用テクニックなど、「ホームページ作成」に関するさまざまなお役立ち情報をお伝えしています。
JavaScriptとCSSで特定DIV要素の表示/非表示を切り替えるサンプル:phpspot開発日誌
Harry Maugans How to Create a Collapsible DIV with Javascript and CSS One of the most handy (and cool) tricks a web developer could learn to use is collapsible DIVs. JavaScriptとCSSで特定DIV要素の表示/非表示を切り替えるサンプル。 次のように数行で行える簡単なサンプルが紹介されていてライブラリに依存しない＆軽い、簡単な実装を行いたい時に使えます。 <div id="mydiv" style="display:none"><h3>This is a test!<br>Can you see me?</h3></div> <a href="javascript:;" onmousedown="if(document
入力文字数の制限を可視化する JavaScript
■ 入力文字数の制限を可視化する JavaScript 好評の、読み込ませるだけシリーズ の8番目。 maxlength 属性とかアプリケーション側とかでフォームの入力文字数を制限していても、ユーザにとっては自分が何文字くらい入力したかがわからないと不便そうなので、汎用的なのを作りました。 フォームにフォーカスが当たると、入力した文字数と入力可能な文字数が表示され、リアルタイムに更新されていきます。 動作サンプル コードは次の通りでして、prototype.js(1.5.0くらい) に依存してます。 var VisualLength = Class.create(); VisualLength.prototype = { initialize: function(attribute) { this.fields = ['INPUT', 'TEXTAREA']; this.attribute
ウェブやブログページを簡単にPDFで提供可能にするJavaスクリプト
ウェブサイトや、ブログのページそのものを、PDFで提供するボタンをJavaSCRIPTを貼り付けるだけで可能にするサービスです。 特にPDF化に手を焼いている人も、この方法であっという間にPDF文章を提供することが可能になる。 5分もあれば、以下の手順で試してもらえれば設置できるでしょう。 1)まずはサイトへ行きサインイン http://web2.pdfonline.com/getting_started/index.htm サインインするための情報は以下のとおりで、非常に簡単です。 ログインしてコードの作成 登録が終われば、先ほど決めたユーザー名とパスワードでログインできます。 後はURLを貼り付けて、コードを作成し、自身のページに貼り付ければ完了という流れです。 試しに貼り付けてみましたが、FC2ブログの記事内では残念ながらエラーが出ました。 でもテンプレートの一部としてや、サイドプラ
webデザイナーのナナメガキ
かなり前にMovableType(3.2)からWordPress(2.0)へ移行した際の手順をメモ。 1.MovableTypeからテキスト形式でエクスポート 2.URLが変わらないように、MovableTypeのアーカイブマッピングとWordPressのURL設定を合わせる。 3.WordPressの管理画面からテキスト形式のファイルをインポート 4.「_」が「-」に変わっていたりするので、手動でURLを変更（DBを直接修正） 5.月別やカテゴリのアーカイブが表示されなかったので、.htaccessにRewriteRuleを追記 6.WordPressが出力するフィード(RSS等)のパスがMovabeTypeと違うのでリダイレクトさせる てな感じで、何とかMovableTypeからアーカイブ等のパーマリンクを変更せずに済みました。 エントリの移行は画像のパスとかに注意すれば、比較的簡単に
Javascriptで指定のHTML要素を動的に角丸デザインにする方法:phpspot開発日誌
Nifty Corners This is the original article. The technique has been improved with better browser support and a lot of new features. The new article has been published on the 6th of April 2005. Javascriptで指定のHTML要素を動的に角丸デザインにする方法。 NiftyCornerを使えば、単一のDIV要素を角丸デザインにすることが可能です。 例えば、次のような単一DIV要素も簡単に角丸にできます。 <div id="nifty"><p>test</p></div> <script type="text/javascript"> Rounded("div#nifty","#377CB1","#9
Flash サンプル
ナウでヤングなレンタルサーバーです。初心者にやさしくて、人気のブログも超カンタンに設置できます。おこづかいでＯＫの格安料金 なんと月額100円（税込105円）から！可愛いアドレスもたくさんで女性に大人気！充実のサポート体制で安心です。
onerrorでエラーを検出 - VTuberになったプログラマーの魂の残滓
@nitoyon IE 6 エラーになる？やべー、手元に Windows がないー。ちょっと別のマシン起動してきます。 http://twitter.com/amachang/statuses/191685642 ってのがあったのでonerrorを使ったエラーの検出方法について書いてみたいと思います。 いきなりソースコード var err = function(a,b,c){ var img = new Image(); img.src = 'http://example.com/error.gif?a=' + escape(a) + '&b=' + escape(b) + '&c=' + escape(c); return true; } window.onerror = err; 用意するもの 上のスクリプトをできるだけページの上部に設置 アクセスログを閲覧できる場所に1x1のerro
小粋空間: Firefox・Netscapeで連続した半角文字を折り返す
FirefoxやNetscape 等、Geckoエンジンを用いたブラウザでは、連続した半角文字（長いURLや半角空白のないスクリプト等）を途中で折り返せないという既知のバグがあります。当サイトでもMTタグをリストとして掲載している記事をFirefox・Netscape等で表示すると、画像のようにブロックからはみ出して表示されてしまいます。 Firefoxまとめサイト：URLっぽい文字列が右端で折り返されずレイアウトが乱れます FirefoxではURLの折り返しについては url_breaker という拡張が公開されており、これがスタンダードな対処方法になっているようです。 あすかぜ・ねっと：url_breaker またURL以外のテキストにも適用したい場合、url_breker_plus が公開されています。 outsider reflex：Firefoxで長いURIを折り返す （本文中に
JavaScript サンプル：『年月に合わせて日付の項目数を変更させてみる』
説明 選択フォームで日付を選択してもらえば、入力チェックなどの手間が省けるので良いのですが、月によって日の値は変わってしまうので、存在しない日付が選択できてしまいます。 しかし、日を選択する選択フォームの項目を動的に変更してやれば問題ありません。 コード function setDay(obj){ obj = obj.form; var years = parseInt(obj.years.options[obj.years.selectedIndex].value); var months = parseInt(obj.months.options[obj.months.selectedIndex].value); var lastday = monthday(years,months); var itemnum = obj.days.length; if (lastday - 1
Web design and development articles and tutorials for advent
24 ways is the advent calendar for web geeks. For twenty-four days each December we publish a daily dose of web design and development goodness to bring you all a little Christmas cheer. Learn more Drew McLellan puts the chairs up on the tables, sweeps the floor, and closes off our season, and indeed the entire 24 ways project with a look back at what it’s meant to run this site as a site project,
fladdict.net blog: JavaScript で音を制御してみたよ
ブログのリンクをマウスオーバーすると、効果音がなるようにしました（ページのロードが終了してからだけど）。 基本的に不可能なはずの、JavaScriptによるサウンドコントロールです。 Ajaxのユーザビリティの向上にでもどうぞ。ソースはこちら。 使用をする場合は、 ・WEBページのエンコードとjsファイルのエンコードを同じにすること ・jsコード内のswfファイルへのパスを、自分のサーバーの絶対パスに変更すること にご注意ください 現在の所、対応ブラウザはほぼパーフェクツ。 win IE6/FF1/OP7 mac IE5.5/Saf1.3/FF1.1 まぁ、タネとしては音声再生用のコンポーネントをflashで作成し、それをJavaScriptで制御しているわけです。 一応過去にも、flashを利用してajaxに効果音やBGMをつけるで紹介したように、先行事例はあるのですが、従来のLiveC
prototype.jsのAjax.PeriodicalUpdaterをIEでも正しく動かす方法:phpspot開発日誌
prototype.jsのAjax.PeriodicalUpdaterをIEでも正しく動かす方法 2006年12月15日- Ajax.PeriodicalUpdater - Ajaxで指定エレメントの内容を定期的に書き換える - prototype.jsリファレンス prototype.jsのAjax.PeriodicalUpdaterをIEでも正しく動かす方法。 prototype.jsのAjax.PeriodicalUpdaterとは、指定のDIV要素(例えば <div id="content"></div>)を指定秒数で定期的に上書きするための機能です。 主に、チャットなど、定期的に特定部分をAjaxによってサーバの返す値に書き換えたい場合に用います。 しかし、IEでは、 http://example.com/server.php というURLにリクエストした場合、2回目以降、キャッ
怠け者へのmochikitノススメ
javascriptライブラリMochiKitというのをご存知だろうか？ 私はこのライブラリを採用して非常に開発が楽になったことから諸君にもおすすめをしたいのでサワリだけ紹介したいと思う。 parial 引数をいちいち指定するのが面倒な人用。 配列を受け取り、それぞれを1加算した配列を返す処理を見てみよう var arr = [1,2,3,4,5]; var v = map( function(x){return x+1}, arr); v -> [2,3,4,5,6] となる。 複数回同じ処理を別の配列に適応する場合は var arr1 = [1,2,3,4,5]; var arr2 = [2,4,6,8,10]; var fx = function(x){return x+1}; var v1 = map(fx,arr1); var v2 = map(fx,arr2); v1 -> [
GreaseMonkey Driven Development / Shibuya.js Technical Talk #2
てんぷれ例 // ==UserScript== // @name Test // @description Test // @namespace http://lowreal.net/ // @include * // ==/UserScript== (function () { /* GM_xmlhttpRequest({ method : "GET", url : url, headers : { "User-Agent":"monkeyagent", "Accept":"text/monkey,text/xml", }, onload : function (req) { var doc = new XML(req.responseText.replace(/^<\?xml.+?\?>/, '')); }, onerror : function (req) { alert(req.r
難読化されたJavaScriptコードを元に戻す:phpspot開発日誌
JsDecorder Decode javascript obfuscated code ! 難読化されたJavaScriptコードを元に戻すJsDecorder。 JavaScriptはコードが見えてしまい、サイズも大きくなるので難読化＆圧縮されたソースは結構ありますが、このツールを使えばWEB上で読みやすくデコードできます。 ↓ オンラインですぐ使えるというので便利ですね。 この逆は、「オンラインでJavaScriptコードを簡単圧縮＆難読化」で紹介したサイトで行えます。
複数のjsライブラリを利用する際にonloadを書き換える方法[to-R]
複数のjsライブラリを利用する際にonloadを書き換える方法 複数のJavaScriptライブラリを利用していて、正常に動作しないや、どちらか一方しか動作しないなどの状況に陥ることがあります。 原因は様々なのですが、一番多いのがJavaScriptライブラリのonload記法に依存する問題です。 onload記法とはJavaScriptを実行するタイミングをonloadイベント（ブラウザがすべてを読み込んでから実行）に設定する際の書き方です。 DreamWeaverを利用している方は、以下のようなソースをよく見るかもしれません。 <body onload="MM_preloadImages('hogehoge')"> これはonloadイベントにMM_preloadImagesという関数を設定しているという意味です。 他にもソースコード中の window.onload = functio
![複数のjsライブラリを利用する際にonloadを書き換える方法[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ユンサンの／／YungSang's: 透過PNG と IE と IE7
caramel*vanilla » Blog Archive » WordPressでLightboxを超簡単に使ってみる
http://siteadminstuff.com/all.html