간지님이 알려주신 lightbox를 테터툴즈에 붙여봅시다~ -0-;
아... 제 방법보다 더 좋은 방법이 있을 수 있겠지만;; 웹개발쪽에 오랫동안 손을 놓은지라.. 다른 좋은 방법이 있으신 분께서는.. 알려주시면 감사하겠습니다.
먼저 lightbox_plus 원본출처를 걸어둡니다. -0-;
적용방법!
1. 여기 간지님의 글을 클릭하시어 간지님이 올려주신 파일들을 몽땅 따운로드 받아봅시다~;(가서 찾아보셔요 -0-)
2. 다운로드 받으신 파일들을 압축을 푼 뒤. lightbox.css, lightbox_plus.js 파일은 테터툴즈 폴더에..
이미지들은 images 폴더에 몽땅 넣어줍니다.
(그냥 몽땅 테터툴즈 폴더 안에 넣으신 분은 4번부터 진행하셔도 무방합니다.)
3. lightbox.css, lightbox_plus.js 파일을 수정하여 경로를 변경해 줍니다.
lightbox.css
lightbox_plus.js 중.
4. 사용하시는 스킨파일의 제일 위에 아래의 코드를 추가해줍니다. (예 tt/skin/myskin/skin.html)
5. 다음 inc_function.php파일에서 다음을 찾아 고칩니다. ( tt/inc_function.php )
주의! 수정 전에 항상 미리 빽업해 두시길 권합니다.
위와 같은 부분을 아래와 같이 만들어 줍니다.
아... 제 방법보다 더 좋은 방법이 있을 수 있겠지만;; 웹개발쪽에 오랫동안 손을 놓은지라.. 다른 좋은 방법이 있으신 분께서는.. 알려주시면 감사하겠습니다.
먼저 lightbox_plus 원본출처를 걸어둡니다. -0-;
적용방법!
1. 여기 간지님의 글을 클릭하시어 간지님이 올려주신 파일들을 몽땅 따운로드 받아봅시다~;(가서 찾아보셔요 -0-)
2. 다운로드 받으신 파일들을 압축을 푼 뒤. lightbox.css, lightbox_plus.js 파일은 테터툴즈 폴더에..
이미지들은 images 폴더에 몽땅 넣어줍니다.
(그냥 몽땅 테터툴즈 폴더 안에 넣으신 분은 4번부터 진행하셔도 무방합니다.)
3. lightbox.css, lightbox_plus.js 파일을 수정하여 경로를 변경해 줍니다.
lightbox.css
| #lightbox { background-color: #eee; padding: 10px; border-bottom: 1px solid #666; border-right: 1px solid #666; } #overlay { background-image: url(./images/overlay.png); } #lightboxCaption { color: #333; background-color: #eee; font-size: 90%; text-align: center; border-bottom: 1px solid #666; border-right: 1px solid #666; } * html #overlay { background-color: #000; background-image: url(./images/blank.gif); filter: Alpha(opacity=50); } |
lightbox_plus.js 중.
| addEvent(window,"load",function() { var lightbox = new LightBox({ loadingimg:'./images/loading.gif', expandimg:'./images/expand.gif', shrinkimg:'./images/shrink.gif', closeimg:'./images/close.gif' }); }); |
4. 사용하시는 스킨파일의 제일 위에 아래의 코드를 추가해줍니다. (예 tt/skin/myskin/skin.html)
| <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link rel="stylesheet" href="./style.css"> <link rel="stylesheet" href="lightbox.css"> <script type="text/javascript" src="lightbox_plus.js"></script> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="index.xml"> |
5. 다음 inc_function.php파일에서 다음을 찾아 고칩니다. ( tt/inc_function.php )
주의! 수정 전에 항상 미리 빽업해 두시길 권합니다.
| (약 818번째 줄) function set_file($type, $cval1, $cval2, $spath, $rpath, $apath) { global $db, $dbid; switch($type) { case "1": list($width, $height) = @getimagesize($rpath.$apath.$cval1); $set_width = $width; $set_height = $height; $scroll = 0; if ($width > 800) { $set_width=820; $scroll = 1; } if ($height > 600) { $set_height=600; $set_width += 16; $scroll = 1; } if ($width > 480) { $GLOBALS["width_overflow"] < $width ? $GLOBALS["width_overflow"] = $width : null; } if (strpos(str_replace(""", "", $cval2), "width=$width") !== false && strpos(str_replace(""", "", $cval2), "height=$height") !== false) return "<img src=\"$spath$apath$cval1\" $cval2 alt=\"\">"; else return "<img src=$spath$apath$cval1 $cval2 style=cursor:pointer onclick=\"window.open( '$spath"."image_pop.php?imagefile=$apath$cval1&width=$width&height=$height', '','width=$set_width,height=$set_height,scrollbars=$scroll')\">"; break; |
| (약 999번째 줄) } else switch (count($cval)) { case "4" : $type = analyze_file($rpath.$cval[1]); if ($cval[0] == "1L") $prefix = "<table align=left><tr><td style=padding-right:5>"; else if ($cval[0] == "1C") { $prefix = "<center><table><tr><td>"; $postfix = "</center>"; } else if ($cval[0] == "1R") $prefix = "<table align=right><tr><td style=padding-left:5>"; $buf = $prefix."<center>".set_file($type, $cval[1], $cval[2], $spath, $rpath, $apath)."</center></td></tr><tr><td class=cap1>$cval[3]</td></tr></table>".$postfix; break; |
위와 같은 부분을 아래와 같이 만들어 줍니다.
| function set_file($type, $cval1, $cval2, $spath, $rpath, $apath,$cval3="") { global $db, $dbid; switch($type) { case "1": list($width, $height) = @getimagesize($rpath.$apath.$cval1); $set_width = $width; $set_height = $height; $scroll = 0; if ($width > 800) { $set_width=820; $scroll = 1; } if ($height > 600) { $set_height=600; $set_width += 16; $scroll = 1; } if ($width > 480) { $GLOBALS["width_overflow"] < $width ? $GLOBALS["width_overflow"] = $width : null; } if (strpos(str_replace(""", "", $cval2), "width=$width") !== false && strpos(str_replace(""", "", $cval2), "height=$height") !== false) return "<img src=\"$spath$apath$cval1\" $cval2 alt=\"\">"; else return "<a href=$spath$apath$cval1 $cval2 rel=\"lightbox\"><img src=$spath$apath$cval1 $cval2 style=cursor:pointer title=\"$cval3\"></a>"; break; |
| } else switch (count($cval)) { case "4" : $type = analyze_file($rpath.$cval[1]); if ($cval[0] == "1L") $prefix = "<table align=left><tr><td style=padding-right:5>"; else if ($cval[0] == "1C") { $prefix = "<center><table><tr><td>"; $postfix = "</center>"; } else if ($cval[0] == "1R") $prefix = "<table align=right><tr><td style=padding-left:5>"; $buf = $prefix."<center>".set_file($type, $cval[1], $cval[2], $spath, $rpath, $apath,$cval[3])."</center></td></tr><tr><td class=cap1>$cval[3]</td></tr></table>".$postfix; break; |
'공부합시다! > Datas' 카테고리의 다른 글
| AppRocket! 응용프로그램에 로켓을 달아보자~ (0) | 2006/04/19 |
|---|---|
| 잠시만 기다려주세요.! 프리로딩 플러그인. (29) | 2006/03/30 |
| [플러그인] 테터툴즈 1.0x 용 트래픽량 출력하기. (15) | 2006/03/20 |
| 테터툴즈에 lightbox를 적용해보자! (13) | 2006/01/25 |
| ASCII Code Table.. (0) | 2006/01/09 |
| Study For Windows Hooking (0) | 2004/11/08 |
태그 : lightbox
