테스트 사이트 - 개발 중인 베타 버전입니다

레벨 아이콘 사이즈 조정 채택완료

배그누1 1년 전 조회 1,683

질문을 남겼었는데 궁금한부분이 있어서

 

원하는건 댓글, 게시판 리스트, 게시글 뷰에 넣은 레벨 아이콘 사이즈를 각각 사이즈 조절과 위치를 조금 움직이는 것입니다.

 

이미지에 클래스 지정해서 하면 된다는 답변을 받았는데

 

레벨 아이콘이 포인트 얻을때마다 레벨이 올라가면서 바뀌는 아이콘입니다.

 

만약에 한가지 이미지 아이콘이면 그냥 경로 지정해서 예를들어 abc.gif 지정해서 하면 되는데

 

조건부로 변하는 아이콘이라서 어떻게 지정해야할지 모르겠습니다.

 

현재 lib 폴더에 level_icon_lib.php를 받아 수정하여 넣어 놓은 상태인데

 

</p>

<p><?php 

if (!defined('_GNUBOARD_')) exit; </p>

<p>// 포인트별 아이콘 부여 

function get_level_icon($mb_id) { 

    global $g5;    </p>

<p>    $max_level = 50; // 마지막레벨 

    

    $mb = get_member($mb_id, "mb_id, mb_point, mb_level"); 

    $ic_mb_id = $mb['mb_id']; 

    $is_admin = is_admin($ic_mb_id); 

    if ($ic_mb_id) {         

        if ($is_admin == 'super') { 

            $mb_icon = "<img src='".G5_IMG_URL."/level/g.gif' align='absmiddle' title='관리자'     width='20px' height='20px'>";   

                }        </p>

<p>        

        else if($mb['mb_level'] == 10){

        $mb_icon = "<img src='".G5_IMG_URL."/level/sp.gif' align='absmiddle' title='관리자2'

        width='20px' height='20px'>";  

            

        }

        else if ($ic_mb_id == 'test' || $ic_mb_id == 'test2') { // 특정회원들 

          $mb_icon = "<img src='".G5_IMG_URL."/level/sp.gif' align='absmiddle' title='특별회원

           width='20px' height='20px'>"; 

            

        } else { 

            $mb_point = $mb['mb_point']; 

            </p>

<p>            // 포인트가 가장 높은 조건부터 체크

            if ($mb_point >= 118000)

                $mb_level = 50;</p>

<p> </p>

<p>중략</p>

<p> </p>

<p> else 

                $mb_level = 1;

    

            $level = ($mb_level > $max_level) ? $max_level : $mb_level;

            $mb_icon = "<img src='".G5_IMG_URL."/level/".$level.".gif' align='absmiddle' title='포인트레벨

            width='20px' height='20px'" .$level."".number_format($mb_point)."점'>"; 

        } 

        

    } 

   else { 

        // 비회원 

        $mb_icon = "<img src='".G5_IMG_URL."/level/0.gif' align='absmiddle' title='손님'>"; 

    } 

    return $mb_icon; 

    //echo $mb_icon; 

} </p>

<p> </p>

<p>

 

이렇게 넣었거든요

 

여기서 사이즈를 수정하여 넣으면 바뀌긴 하는데 모든 아이콘 사이즈가 공통으로 수정되어서.....

 

level_icon_lib.php 여기에 코드를 넣어서 수정해야하는것인지 생각해봤는데 그건 아닌거 같기도하구요

 

혹시 어떻게 해야할까요

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
1년 전

다음은 css 로 같은 크기의 이미지에 임의의 class 를 지정하고 표현하는 예제 입니다.

 

1.png ~ 6.png

     

 

style.css

</p>

<p>/* -------------------------------- common */

.level_icon { vertical-align: middle; }</p>

<p> </p>

<p>/* -------------------------------- test_1 */

.test_1 .level_icon { width: 20px; height: 20px; }</p>

<p> </p>

<p>/* -------------------------------- test_2 */

.test_2 .level_icon[src="1.png"] { width: 60px; height: 60px; }

.test_2 .level_icon[src="2.png"] { width: 50px; height: 50px; }

.test_2 .level_icon[src="3.png"] { width: 40px; height: 40px; }

.test_2 .level_icon[src="4.png"] { width: 30px; height: 30px; }

.test_2 .level_icon[src="5.png"] { width: 20px; height: 20px; }

.test_2 .level_icon[src="6.png"] { width: 10px; height: 10px; }</p>

<p> </p>

<p>/* -------------------------------- test_3 */

.test_3 .level_icon[src="1.png"] { margin-left: 10px; margin-top: 10px; }

.test_3 .level_icon[src="2.png"] { margin-left: 20px; margin-top: 20px; }

.test_3 .level_icon[src="3.png"] { margin-left: 30px; margin-top: 30px; }

.test_3 .level_icon[src="4.png"] { margin-left: 40px; margin-top: 40px; }

.test_3 .level_icon[src="5.png"] { margin-left: 50px; margin-top: 50px; }

.test_3 .level_icon[src="6.png"] { margin-left: 60px; margin-top: 60px; }</p>

<p>

 

test.html

</p>

<p><link type="text/css" href="style.css" rel="stylesheet"></p>

<p> </p>

<p><fieldset>

    <legend>test_1</legend>

    <div class="test_1">

        <img class="level_icon" src="1.png">

        <img class="level_icon" src="2.png">

        <img class="level_icon" src="3.png">

        <img class="level_icon" src="4.png">

        <img class="level_icon" src="5.png">

        <img class="level_icon" src="6.png">

    </div>

</fieldset></p>

<p> </p>

<p><fieldset>

    <legend>test_2</legend>

    <div class="test_2">

        <img class="level_icon" src="1.png">

        <img class="level_icon" src="2.png">

        <img class="level_icon" src="3.png">

        <img class="level_icon" src="4.png">

        <img class="level_icon" src="5.png">

        <img class="level_icon" src="6.png">

    </div>

</fieldset></p>

<p> </p>

<p><fieldset>

    <legend>test_3</legend>

    <div class="test_3">

        <img class="level_icon" src="1.png">

        <img class="level_icon" src="2.png">

        <img class="level_icon" src="3.png">

        <img class="level_icon" src="4.png">

        <img class="level_icon" src="5.png">

        <img class="level_icon" src="6.png">

    </div>

</fieldset></p>

<p>

 

result

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

배그누1
1년 전
친절한 답변 너무 감사드립니다. 많은 도움이 되었습니다^^
해보다가 잘 안되가지고 포기하려던 찰라 이것저것 해보고 아웃로그인 이미지가 다른거보고
띵하고 확인하고 넣어봤습니다. 제가 활용을 못하던 거더라구요 감사드립니다 ㅎㅎ

댓글을 작성하려면 로그인이 필요합니다.

1년 전

레별별. 이미지마다 class를 추가하고 css설정을 해주면 되겠네요

lib화일 내에서 하면됩니다

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

배그누1
1년 전
답변 감사드립니다. 설명듣고 무슨 말인지는 알겠는데 막상 쓰려니까 잘안되더라구요 ㅎㅎ
다시 한번 도움 받고 갑니다!!

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인