학

페이지 표시 모양변형

· 2004-03-26 (금) 17:19:08 · 2896 · 2
get_paging.gif
bugs_button.gif
페이지 표시 모양이 심심한듯하여 요즘 많이 쓰는듯한 모양으로 변형함과 동시에 마우스 올리면 설명이 나타나는 기능을 추가(?) 하였습니다. (첫번째 그림)
그림 사용을 배제하고 스타일 만으로 이미지를 사용한듯한 느낌을 나타내었습니다.

:: 수정방법 ::
lib/common.lib.php 에서 get_paging 함수를 아래의 내용으로 바꿉니다.
------------------------------------절취선-----------------------------------
// 현재페이지, 총페이지수, 한페이지에 보여줄 행, URL
# 3.10 수정 $n 인수는 사용하지 않으므로 삭제
# 강조색 추천: #FF4D00 (주황)
#function get_paging($write_pages, $cur_page, $total_page, $n, $url)
function get_paging($write_pages, $cur_page, $total_page, $url)
{
global $cfg;

$strs = array();

if ($cur_page > 1)
{
$strs[] = "<a href='" . $url . "1' title='최초 페이지로 이동' style='font-size:7pt;color:gray;letter-spacing: -3px;'>■◀</a>";
$strs[] = "<a href='" . $url . ($cur_page-1) . "' title='".($cur_page-1)." 페이지로 이동' style='font-size:7pt;color:gray;'>◀</a>";
}

$start_page = ( ( (int)( ($cur_page - 1 ) / $write_pages ) ) * $write_pages ) + 1;
$end_page = $start_page + $write_pages - 1;

if ($end_page >= $total_page) $end_page = $total_page;

if ($start_page > 1)
$strs[] = "<a href='" . $url . ($start_page-1) . "' title='". ($start_page-1) . " 페이지로 이동' style='font-size:7pt;color:gray;letter-spacing: -4px;'>◀◀</a>";

if ($total_page > 1) {
for ($k=$start_page;$k<=$end_page;$k++) {
if ($cur_page != $k)
$strs[] = "<a href='$url$k' title='$k 페이지로 이동'>$k</a>";
else
$strs[] = " <b style='color:gray;' title='현재 페이지 : $k'>$k</b> ";
}
}

if ($total_page > $end_page)
$strs[] = "<a href='" . $url . ($end_page+1) . "' title='". ($end_page+1) . " 페이지로 이동' style='font-size:7pt;color:gray;letter-spacing: -4px;'>▶▶</a>";

if ($cur_page < $total_page)
{
$strs[] = "<a href='$url" . ($cur_page+1) . "' title='" . ($cur_page+1) . " 페이지로 이동' style='font-size:7pt;color:gray;'>▶</a>";
$strs[] = "<a href='$url$total_page' title='$total_page 페이지로 이동' style='font-size:7pt;color:gray;letter-spacing: -3px;'>▶■</a>";
}

$str = implode("<font color=#b5b2b5> | </font>", $strs);
return $str;
}

------------------------------------절취선-----------------------------------

주석 달아놓은 추천 강조색으로 색을 바꾸시면 이쁘게 나옵니다.
바꾸시는 방법은 편집기에서 찾기&바꾸기 : gray > #FF4D00 하시면 됩니다.

:: 뽀너스 ::
스타일로 '벅스' 버튼 만들기 (두번째 그림)

<style>
button {
color: #424542;
background-color:white;
border-top-width:1pt;
border-right-width:1pt;
border-bottom-width:1pt;
border-left-width:5pt;
border-top-color:rgb(189,182,189);
border-right-color:rgb(189,182,189);
border-bottom-color:rgb(189,182,189);
border-left-color:rgb(255,166,24);
border-style:solid;
font-weight:bold;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#EFEBEF', Direction=135, Strength=5);
padding-left:5px;
padding-right:5px;
padding-top:3px;
}
</style>

<button onfocus="this.blur();"> O K </button>

단점은 다른것과 한줄에 있으면 높이가 다르게 나타난다는것입니다.

첨부파일

get_paging.gif (2.1 KB)
13회 2004-03-26 17:19
bugs_button.gif (2.1 KB)
8회 2004-03-26 17:23
|

댓글 2개

멋집니다^^
음 좋군요...^.^..
댓글을 작성하시려면 로그인이 필요합니다.

그누3 팁자료실

1,026건
+
제목 글쓴이 날짜 조회
04-04-05 조회 2,526
04-04-05 조회 4,051
04-04-04 조회 3,808
04-04-03 조회 2,504
04-04-01 조회 2,593
04-03-26 조회 2,897
04-03-26 조회 2,878
04-03-25 조회 2,851
04-03-24 조회 2,446
04-03-24 조회 2,506
04-03-22 조회 2,562
04-03-20 조회 3,953
04-03-20 조회 2,543
04-03-18 조회 3,635
04-03-15 조회 3,030
04-03-12 조회 2,645
04-03-12 조회 2,358
04-03-05 조회 5,263
04-03-05 조회 2,952
04-03-05 조회 3,022