그누보드5 그룹메뉴 select 셀렉트로 보이게 하기

키워드 : 그누보드 그룹메뉴, 그룹메뉴 셀렉트 메뉴로,그누보드5 셀렉트 메뉴

무료아이콘 전체게시물 작성일16-05-17 04:38 조회4,660회

본문

그누보드5 그룹메뉴 select 셀렉트로 보이게 하기

 

기존에 말자닷컴에 적용한 그룹메뉴의 경우

아래와 같이 너무 많은 그룹 게시판으로 인해

페이지의 절반은 차지 했는데

 

e80f56f2c520e118930fcd442f688b9f_1463426

 

한 눈에 보여서 찾기는 쉬울 거 같지만

그래도 너무 많은 부분을 차지해서

 

select 셀렉트에 넣어 선택해서 볼 수 있게끔 했네요.

 

별로다 싶으면 백도 하면 되니 ^^;;;

구글링해서 이것저것 넣고 적용을 마무리했네요

 

그룹 메뉴는 애드픽님이 올려주신 그룹메뉴를 사용했답니다. (이것 저것 수정해서 위의 이미지 처럼 된 -_-;;;;)

http://sir.kr/g5_skin/3429?sca=%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83&sfl=wr_subject%7C%7Cwr_content&stx=adffix

 

 

쨋든...


말자는 아래와 같이 groupmenu.skin.php 수정 해줬답니다.

프로그래머가 아닌 초보라서 코드가 제대로 된지는 모르겠으나

일단 말자가 원하는 모습으로 구현이 되서 팁에 올려봐요 ㅋㅋ

 

groupmenu.skin.php


 <?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
add_stylesheet('<link rel="stylesheet" href="'.$groupmenu_skin_url.'/css/style.css">', 0);
?>

<div id="subMenuWrap">
 <div id="sub_menu_select">서브 메뉴 선택 → </div>
 <select id='sub_menu' value='$bo_table' onchange='$bo_table'>
  <?php for ($i=0; $i<count($groupmenu); $i++) {  ?>
  <option href="<?php echo $groupmenu[$i]['href'] ?>" value="<?php echo $groupmenu[$i]['subject'] ?>" <?php if($bo_table==$groupmenu[$i]['bo_table']) { echo "class='on' selected";} ?>><a href="<?php echo $groupmenu[$i]['href'] ?>"><?php echo $groupmenu[$i]['subject'] ?></option>
  <?php }  ?>
 </select>
</div>
<script>
document.getElementById('sub_menu').onchange = function() {
    window.location.href = this.children[this.selectedIndex].getAttribute('href');
}
</script>

 

 

css


 @charset "utf-8";
#subMenuWrap{
 font-size:13px;
 font-family:inherit;
}
#subMenuWrap:after{
 content:'';
 clear:both;
 display:block;
 
}
#sub_menu_select, select#sub_menu{
 font-size:13px;
 font-family:inherit;
}
#sub_menu_select{
 float:left;
 padding:0 10px;
 height:30px;
 line-height:30px;
 background-color:#efefef;
}
select#sub_menu {
 margin:0;
 padding:0;
 float:left;
 padding-left:10px;
 height:30px;
 line-height:30px;
 border:1px solid #efefef;
 border-radius:0px;
 -webkit-border-radius:0;
 -moz-border-radius:0;
 -ms-border-radius:0;
}
#sub_menu .on{
 padding:10px;
 color:#ff0000;
 font-weight:bold;
 display:inline-block;
}

 

 

위와 같이 수정하면

아래와 같이 두둥...

 

e80f56f2c520e118930fcd442f688b9f_1463427 

 

셀렉트 그룹 메뉴를 선택하면

그룹 게시판 메뉴를 선택할 수 있는...

아이폰6인데 다른데는... > ,. <

 

e80f56f2c520e118930fcd442f688b9f_1463427 


 

비회원도 추천 가능합니다.
유익한 정보였다면, 추천해주세요

추천 5 비추천 0

그누보드 팁

96개의 게시물
목록
읽기: 1P (1lv), 쓰기: 100P (3lv), 덧글: 10P (2lv), 다운: -10P (2lv)
그누보드 팁 목록
번호 제목 아이디 날짜 조회수 추천
96 그누보드 무한 카테고리 계층형 카테고리, 여러 값에서 원하는 1개의 값만 출력하기 무료아이콘 전체게시물 11-18 10 추천: 0
95 [외부링크]회원 필드를 여분 필드로 사용하고 게시판에 출력할 때 관련링크 무료아이콘 전체게시물 11-18 15 추천: 0
94 그누보드 g5 설치 후 경로가 이상해서 이미지가 다 깨질 때 인기글 말자 전체게시물 06-17 9126 추천: 3
93 그누보드 무한 카테고리 계층형 카테고리 댓글1 무료아이콘 전체게시물 09-16 52 추천: 1
92 그누보드5 회원가입 여분필드 중복 체크 검사하기 무료아이콘 전체게시물 09-14 29 추천: 1
91 그누보드5 휴대폰 중복 체크가 안 되요 무료아이콘 전체게시물 09-13 43 추천: 1
90 그누보드5 에디터 지정된 넓이 조절 무료아이콘 전체게시물 09-08 36 추천: 1
89 그누보드5 여분필드 다중 체크 박스 함수로 만들기 댓글1 무료아이콘 전체게시물 09-07 354 추천: 1
88 초보를 위한 SELECT (셀렉트박스) 함수로 만들어 쉽게 사용하기 관련링크 무료아이콘 전체게시물 09-07 45 추천: 1
87 글쓰기 시 올바른 방법으로 이용해 주십시오 무료아이콘 전체게시물 09-06 55 추천: 1
86 그누보드5 로그인 스킨 skin/member/basic/login.skin.php 첨부파일 무료아이콘 전체게시물 08-28 330 추천: 2
85 그누보드5 여분필드 추가하기 관련링크 무료아이콘 전체게시물 08-23 117 추천: 1
84 그부보드5 select 다중 여분필드 연동식 사용하기 첨부파일 무료아이콘 전체게시물 08-23 178 추천: 1
83 그누보드5 여분 필드 제목, 값 사용하기 and 관리자에서 여분필드를 input가 아닌 t… 무료아이콘 전체게시물 08-22 128 추천: 1
82 그누보드5 - 게시판 보기에서 여분필드 값 특정 레벨만 보여지게 하기 무료아이콘 전체게시물 07-29 41 추천: 1
게시물 검색