스크립트 고수님 도움좀 청하겠습니다.
본문
안녕하세요 아래 링크를 만지작 중인데요
https://stove99.tistory.com/103
1번2번 ul는 무조건 클릭안해도 노출하게 할수있는 스크립트를 짜야하는데 방법좀 알려주시면 감사하겠습니다 ㅠㅠ
html은 안건드리고 스크립트 부분에서요
<script>
// html dom 이 다 로딩된 후 실행된다.
$(document).ready(function(){
// menu 클래스 바로 하위에 있는 a 태그를 클릭했을때
$(".menu>a").click(function(){
var submenu = $(this).next("ul");
// submenu 가 화면상에 보일때는 위로 보드랍게 접고 아니면 아래로 보드랍게 펼치기
if( submenu.is(":visible") ){
submenu.slideUp();
}else{
submenu.slideDown();
}
});
});
</script>
답변 3
<ul class="hide"> 이걸로 모두 닫기 되어있자나요
보여줄 곳에선 hide가 없어야겟죠?
while로 반복문 쓰셧네요
원하는 순서에 hide가 안되어있으면 될거 같네요
php나 자바스크립트로 원하시는 펼침을 찾으셔서 hide를 날려주세요
class="hide" 이걸 지우니 전체 보이긴하네요.
제가 초보라 첫번째 두번째만 class="hide" 적용안되게 그외에는 다 class="hide" 적용되게 하는방법은 없을까요 ㅠㅠ?
php나 자바스크립트를 아셔야 해요
현 반복문은 php로 돌리셨자나요
php로 예를 들자면
그럼 임이의 변수 $i 라고 지정했을때
$i = 0 ; 으로 지정하시고 while 문 끝나기 전에 1증가를 하는거죠 $i++;
처음 반복문에선 $i값이 0이고 반복문 돌고나면 $i값은 1이고 점점 증가하게 됩니다.
if 문을 사용해서 처음과 두번째에 조건문넣으시고 나머지는 이래 되라 라고 명령어 만들면 될거 같네요
if($i==0 || $i == 1){
echo '<ul>';
} else {
echo '<ul class="hide">';
}
이해만 하도록 작성한것이니 응용해보세요
$ii=0;
while($row=sql_fetch_array($query)){
$ii++;
if( $ii < 2) $hide=''; else $hide='hide';
?>
<div class="menu_option">
<ul>
<li class="menu">
<a> <h4><span><?=$row['cg_title']?></span></h4></a>
<ul class="<?=$hide?>" >
<?
와 엑스엠엘님 감사합니다.
예제 페이지에 나온대로 구성하면 펼쳐져 있는것 아닌가요?
<script src="http://code.jquery.com/jquery.min.js"></script>?
<script>
// html dom 이 다 로딩된 후 실행된다.
$(document).ready(function(){
// menu 클래스 바로 하위에 있는 a 태그를 클릭했을때
$(".menu>a").click(function(){
var submenu = $(this).next("ul");
// submenu 가 화면상에 보일때는 위로 보드랍게 접고 아니면 아래로 보드랍게 펼치기
if( submenu.is(":visible") ){
submenu.slideUp();
}else{
submenu.slideDown();
}
});
});
</script>
<div>
<ul>
<li class="menu">
<a><img src="" alt="상위메뉴이미지1"/></a>
<ul class="hide">
<li>메뉴1-1</li>
<li>메뉴1-2</li>
<li>메뉴1-3</li>
<li>메뉴1-4</li>
<li>메뉴1-5</li>
<li>메뉴1-6</li>
</ul>
</li>
<li class="menu">
<a><img src="" alt="상위메뉴이미지2"/></a>
<ul class="hide">
<li>메뉴2-1</li>
<li>메뉴2-2</li>
<li>메뉴2-3</li>
<li>메뉴2-4</li>
<li>메뉴2-5</li>
<li>메뉴2-6</li>
</ul>
</li>
</ul>
</div>
클릭해야지만 펼쳐 집니다
소스 대로만 했을때 펼쳐져 있습니다.
제가 적용한 소스인데 여기에서는 닫혀있는데 어느부분을 수정해야할까요
<form action="./list.php" method="GET">
<div class="s_menu">
<div class="s_menu_option" style="border-bottom:#ffffff 0px solid;border-left: 1px solid #b6bdc7;border-right: 1px solid #b6bdc7;">
<?
// if( $_GET['qcaid'] ){
// $c1 = substr($_GET['qcaid'],0,2);
// $c2 = substr($_GET['qcaid'],2,2);
// }
//쿼리
$sql = "
SELECT
*
FROM
g5_cate_box
WHERE
cg_id='".$c1."' AND cg_id2='".$c2."'
ORDER BY
IF(cg_idx=0,0,cg_idx) ASC, cg_num asc
";
//if( $_SERVER["REMOTE_ADDR"] == "49.167.72.194" ){
// echo "<pre>".$sql."</pre>";
// echo "<br>";
//}
//echo "<pre>".$sql."</pre>";
$query = sql_query($sql);
//검색항목 문자 변환
$qs_str = '';
if( is_array($_GET['qs'])==true ){
$qs_str = implode('@',$_GET['qs']);
$qs_str = '@@'.$qs_str.'@';
}
while($row=sql_fetch_array($query)){
?>
<div class="menu_option">
<ul>
<li class="menu">
<a> <h4><span><?=$row['cg_title']?></span></h4></a>
<ul class="hide">
<?
//속성값 구분자를 통해 표시
$array = explode('@',$row['cg_spec']);
$total = count($array);
for($i=0;$i<$total;$i++){
?>
<?if( $array[$i] ){?>
<li >
<input type="checkbox" name="qs[]" <?if( strpos($qs_str,'@'.$array[$i].'@')>0 )echo'checked';?> value="<?=$array[$i]?>"/>
<span class="cname"><?=$array[$i]?></span><span class="cnt"></span>
</li>
<?}else{?>
<li></li>
<?}?>
<?
}
?>
</ul>
</li>
</ul>
</div>
<?
}
?>
</div>
</div>
