XOOPS for you

This is hack to popup image in MyAlbum Module
popup the large image, when move the mouse over the thumbnail image.


* setting *
1. JavaScript files setting
1.1 set in program
the setting is unnecessary.
already set into the xoops_module_header variable in index.php and viewcat.php

1.2 set in theme
add the following lines under title tag in theme.html
-----
<script type="text/javascript" src="<{$xoops_url}>/modules/myalbum/overlib.js"></script>
<script type="text/javascript" src="<{$xoops_url}>/modules/myalbum/overlib_image.js"></script>
-----

in this case, modified index.php and viewcat.php are unnecessary.

2. div tag setting
2.1 set in myalbum template
the setting is unnecessary.
already set in myalbum_header.html

2.2 set in theme
add the following lines under body tag in theme.html
-----
<div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>
-----

in this case, modified myalbum_header.htm is unnecessary.


* JavaScript library *
use JavaScript library "overLIB" which is modified to fit XOOPS environment.
http://www.bosrup.com/web/overlib/


* notice *
conflict "myalbum_header.html", if using with "RSS for MyAlbum Module".
please use "Popup + RSS + Piclens for MyAlbum Module"


* enclosed files
modified files
- index.php
- viewcat.php
- templates/myalbum_header.html
- templates/myalbum_photo_in_list.html
- templates/myalbum_viewcat_table.html

added files
- overlib.js
- overlib_image.js

MyAlbum モジュールに 写真のポップアップを付加するハックです。
サムネイル画像にマウスを乗せると、大きな写真がポップアップします


● 設定
1. JavaScript ファイルの設定
1.1 プログラムで設定する
特に設定は不要です。
index.php と viewcat.php にて、テンプレート変数 xoops_module_header に設定しています。


1.2 テーマで設定する
使用している テーマ の theme.html の title タグの下に下記を追加する
-----
<script type="text/javascript" src="<{$xoops_url}>/modules/myalbum/overlib.js"></script>
<script type="text/javascript" src="<{$xoops_url}>/modules/myalbum/overlib_image.js"></script>
-----

この場合は、変更後の index.php と viewcat.php は不要です。

2. div タグの設定
2.1 myalbum のテンプレートで設定する
特に設定は不要です。
myalbum_header.html に設定しています。

2.2 テーマで設定する
使用している テーマ の theme.html の body タグの下に下記を追加する
-----
<div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>
-----

この場合は、変更後の myalbum_header.html は不要です。


● JavaScript ライブラリ
JavaScript ライブラリ「overLIB」を XOOPS 環境に合うように若干改造して使っています。
http://www.bosrup.com/web/overlib/


● 注意
「RSS for MyAlbum Module」と併用すると、「myalbum_header.html」が衝突します。
「Popup + RSS + Piclens for MyAlbum Module」をご利用ください。


● 同封したファイル
変更したファイル
- index.php
- viewcat.php
- templates/myalbum_header.html
- templates/myalbum_photo_in_list.html
- templates/myalbum_viewcat_table.html

新設したファイル
- overlib.js
- overlib_image.js