現在、外部の会社から出てきたHTMLのコードにCakePHPのAjaxの処理を埋め込むと、メニューの画像がロールオーバーしなくなります。
HTMLを見てみると、rollovers.jsというJavascriptでロールオーバーをしているようです。prototype.jsを読み込むところを削除すると、うまくロールオーバーしてくれます。しかし、Ajaxの処理はしてくれなくなります。
CakePHPでAjaxを実装すると、prototype.jsが必要です。CakePHPの機能を使わずにAjaxの処理を書くのはとても面倒です。では、rollovers.jsを取るか、CakePHPのAjaxを取るかをどちらかにするかと言われればCakePHPのAjaxをとりました。
もっとシンプルにJavascriptでロールオーバーできないかと探したところ、ありました。シンプルロールオーバー。
メニューの画像ファイルの命名が
*_o.gif //ロールオーバー前
*_h.gif // ロールオーバー後
になっていますので、少々修正をするだけでOK。無事にAjaxの処理とメニューのロールオーバーが実現できました。シンプルロールオーバーの作者に感謝です。
SBクリエイティブ
¥2,287 (2025/03/25 15:17時点 | Amazon調べ)

著:谷 拓樹
¥1,881 (2025/03/25 15:17時点 | Amazon調べ)

追記(2022年10月16日)
記事中のシンプルロールオーバーのサイトはどこかになくなりました。