JavaScript

jQueryでのマウスオーバーによる画像入れ替え

DreamWeaverなどで吐き出されるjavascriptを用いずに、jQueryだけでマウスオーバーによる画像表示の変更を行う。 サムネイル画像(XXXX_ex.jpg)にマウスを乗せると表示部分(id: exampleimage)に(XXXX_big.jpg)が表示される。 大きい画像も最初に読み込んでお…

jQueryでロールオーバー

jQueryでロールオーバーさせるため、また、jQueryプラグインの作成の勉強としてjquery.rollover.jsを作った。 なお、ロールオーバー以外にもカレントパスを指定するとロールオーバーさせないようにできるようになっている。 http://www.miyagino.net/my/jque…

javascriptでprototypeを使って継承させる(親クラスに引数ありの場合)

prototypeプロパティを使ってjavascriptでのクラス継承を実現させる方法。親クラスに引数がないときには、 var MySub = function () { /* .... */ }: MySub.prototype = new MySuper(); var sub = new MySub(); でいいのだが、サブクラスのインスタンス生成…

jqueryプラグインflexigridのカラム非表示

表示テーブルをソートしたりカラム幅を変更したりページ送りできたりするjqueryのプラグインflexigrid。 http://www.flexigrid.info/ xml, jsonデータをajaxでロードすることも可能だが、既存のhtmlにも適用可能。 既存htmlに使ってみて以下のようにしたかっ…

jqueryで画像ロールオーバー(rollover)の実現

プラグインなしでjqueryを使用して画像ロールオーバー(rollover)を実現する。dreamweaverで吐き出すコードは使用しないのでhtmlコードがシンプルに書けるところが利点。 http://rewish.org/javascript/jquery_rollover ここでは、 <ul> <li class="rollover"><a href="#"><img src="foo.jpg" alt="サンプル" /></a></li> </ul> と書いておくとよいよう…

thickboxをページロード時に表示させる方法

jquery & thickboxにて、ページが表示する最初にthickboxを起動したい場合の方法。 <link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" /> <script src="jquery.js" type="text/javascript"></script> <script src="thickbox.js" type="text/javascript"></script> <script type="text/javascript"> //</link>

Wordpress 2.7 での wp-amazon プラグイン

Wordpressを2.7にアップグレードしたところ、使用していたwp-amazonプラグインが動作しなくなってしまった。調べていたら、 http://www.whowants.net/wp/?p=827 http://netafull.net/aff/027747.html を見つけた。 こちらでも、wp-amazonのプラグインを停止…

javascriptのリテラル(literal)

class GInfoWindowOptionsInstances of this class are used in the opts? argument to the methods openInfoWindow(), openInfoWindowHtml(), openInfoWindowTabs(), openInfoWindowTabsHtml(), the bindInfoWindow*() variants, and showMapBlowup() of cl…

シングルクォートと文字列の間に半角スペースが。。。

よくわからない現象に悩まされた。1. javascriptで生成したjsonのコードをinnerHTMLにて画面に表示。 2. マウスで対象部分をdragしてcopy。 3. エディタでhtmlにpaste。最初の一行目は問題ないが、二行目以降、シングルクォートと文字列の間に半角スペースが…

meta refresh, Locationヘッダを使用した場合のHTTP_REFERERについて

<meta http-equiv="Refresh" content="0; URL=http://www.miyagino.net/" /> や、 print <</meta>

Google Maps API setMapType()でのエラー

GMap2#setMapType()はGMap2#setCenter()以降に呼び出すこと。でないと、 a has no properties main.js (line 443)Xf.prototype=new uj;Xf.prototype.fromLatLngToPixel=function(a,b){var c=this,d=c.... のエラーが出る(Firebugにて)。 var map = new GMap2…

Google Maps API でのマウスホイールでのズーム(zoom)機能

v2.78以降の機能。 var map = new GMap2(document.getElementById("mapid")); .... map.enableDoubleClickZoom(); // v2.58 or later map.enableContinuousZoom(); // v2.58 or later map.enableScrollWheelZoom(); // v2.78 or later .... GMap2#enableDoub…

(Java|ECMA)scriptでのString#match(), String#replaceの正規表現

String#match(),String#replace()に指定する正規表現に関して、変数を使用する場合。 var MATCH_REGEX = '^http:\/\/www\.example\.jp\/'; var REPLACE_REGEX = 'http:\/\/www\.example\.jp\/'; var url = '....'; .... if (url.match(MATCH_REGEX)) { alert…

xmlhttprequestでの同期通信・非同期通信の例

xmlhttprequestはデフォルトで非同期通信。 非同期通信の例 XMLHttpRequest#onreadystatechangeに関数定義する。 var req = new XMLHttpRequest(); req.onreadystatechange = function () { if (req.readyState == 4 && req.status == 200) { document.getEl…

GMakerManagerを使用してのpanTo() or setCenter() and openInfoWindowHtml()

某サイトで、いままでGMap2#addOverlay()で追加していたGMaker(以下:マーカ)をGMakerManagerを使用して登録するようにしてみた。 というのは、GMakerManagerを使用すると表示部周辺(で最少、最大ズーム範囲内)のマーカだけを追加することになるらしく、これ…

SafariでのDate.parse()

Safari 1.0.3 on MacOS X 10.2.8 という環境で、 Date.parse('2007/02/01 00:00:00'); は、2019年8月17日と認識されてしまう。なぜ?で、 Date.parse('Feb, 1 2007 00:00:00'); と変更。

xhtmlでのjavascriptの書き方

<html xmlns="http://www.w3.org/1999/xhtml"> <head> .... <meta http-equiv="Content-Script-Type" content="text/javascript" /> .... <script type="text/javascript"> // </meta></head></html>

CGIとJavascript

CGIで出力したhtml中のJavascriptにて、window.onloadを行いたい場合。 .... <script type="text/javascript"> <!-- window.onload = function() { .... } // --> </script> </body> </html> と書く位置(終了body要素の前)に書いておく必要があるみたい。

xmlhttprequestでgetしたときの文字コード

XMLHttpRequest()にて、あるhtmlを取得しようとした場合に、文字コードをちゃんと認識させる方法。Apache限定。あるhtmlファイルをhtml.sjisとかにするとShift_JISとして取得してくれる。 var req = new XMLHttpRequest(); .... req.open("GET", "foobar.htm…

DreamWeaverで生成されたポップアップメニューJavaScript

DreamWeaver MXにて生成されたポップアップメニューがIE7では横に表示させたいメニューが縦に表示されてしまう(IE6、Firefoxでは問題なし)。 IEの場合には、 <div id="menuItemN"> <div id="menuItemTextN"> (同様にid="menuItemHiliteN"もある) <div id="menuItemShimN"> <div align="left">文字列</div> という要素でメニューを構成している。このmenuIte</div></div></div>…

Array#lengthの動作(結論)

http://d.hatena.ne.jp/kazuokohchi/20061106で、ちょっと困っていたことに対して、inamoriさんからコメントとトラックバックを頂いていた。 トラックバック先ではECMAの仕様書まで調べていただいており、結論としては、IE側がきっちりとECMAの仕様書に準拠…

Yahoo User Interface Library

Yahoo User Interface Libraryという(?:ECMA|Java)Scriptで書かれたユーティリティがある。これ、とてもいい感じで、しかもBSD Licenseで配布されているのだ。いま、これを使ってちょっとしたカレンダーアプリケーションを作ろうかと思っているのだが、IEだ…

関数オブジェクトの代入

いつも、 window.onload = function() { .... }と書いていたので気が付かなかったが、http://homepage3.nifty.com/aya_js/js2/js201.htm によると、 <SCRIPT LANGUAGE="JavaScript"> var a; function init() { a = document.forms[0].elements[0].value; } window.onload = init; </SCRIPT> a という…

ハッシュ配列

ハッシュ配列(Javascriptではハッシュとはいわないのかな?)の要素すべてを処理する場合には以下のようにする。 var a = [ "no1" : [0, 1, "あ"], "no2" : [2, 3, "い"], "no3" : [4, 5, "う"], "no4" : [6, 7, "え"], "no5" : [8, 9, "お"] ]; window.onload…

Array#lengthの動作

(Java|ECMA)Scriptで、 var a = ["a", "b", "c", ]; // 最後にカンマがある alert(a.length);と書いた場合、Firefox、Operaは3なのに、IE[67]は4なんだよね。結構困っちゃうな(もちろん、最後のカンマを取ればすべて3なんですけどね)。 ちなみに、同じような…

GoogleマップとIE

CMSツールを使用してページの真ん中にGoogleMapsを表示させようと編集していたのだが、Firefoxではうまくいくのに、IEでは、 インターネット サイト http://www.example.jp を開けません。 操作は中断されました というエラーが出てしまった。 いろいろ検索…

link thumbnail

http://lab.arc90.com/2006/07/link_thumbnail.php というおもしろいものを見つけた。ダウンロードしてきたファイルには、例のhtmlと(?:Java|ECMA)Scriptが入っていたので、(?:Java|ECMA)Scriptを参照してみると、 var n = h.replace(/[^:]*:\/\/([^:\/]*)(:…

(?:Java|ECMA)Scriptでのzoom (in|out)

Webページのイメージをそのまま縮小したり、拡大したりできないものかと思って検索していたら、 window.top.document.body.style.zoom = 0.5; // 50% のようなことができるようだ。

Google AJAX Search API

http://d.hatena.ne.jp/chiyorozu/20060602/p1にGoogle AJAX Search APIのことが書いてあったので早速sign upした。でも、Google Maps APIでsign upしたときと同じキーを頂いたのだ。sign upは必要なかったのかな?

XMLHttpRequestでのBasic認証

XMLHttpRequestでは、Basic認証も行えるようだ。 function basic_auth(oid) { var req = new XMLHttpRequest(); var myurl = 'http://www.example.jp/foobar/auth/'; var id = document.baform.baid.value; var pw = document.baform.bapw.value; req.onread…