테스트 사이트 - 개발 중인 베타 버전입니다
SIR
목록으로
이전글 다음글

스크립트 고수님 도움좀 청하겠습니다. 채택완료

초비입니다 2년 전 조회 1,143
답변 3
목록

안녕하세요 아래 링크를 만지작 중인데요 

https://stove99.tistory.com/103

 

1번2번 ul는 무조건  클릭안해도 노출하게 할수있는 스크립트를 짜야하는데 방법좀 알려주시면 감사하겠습니다 ㅠㅠ

html은 안건드리고 스크립트 부분에서요 

 

</p>

<p> </p>

<p><code><script></code></p>

<p><code>    </code><code>// html dom 이 다 로딩된 후 실행된다.</code></p>

<p><code>    </code><code>$(document).ready(</code><code>function</code><code>(){</code></p>

<p><code>        </code><code>// menu 클래스 바로 하위에 있는 a 태그를 클릭했을때</code></p>

<p><code>        </code><code>$(</code><code>".menu>a"</code><code>).click(</code><code>function</code><code>(){</code></p>

<p><code>            </code><code>var</code> <code>submenu = $(</code><code>this</code><code>).next(</code><code>"ul"</code><code>);</code></p>

<p> </p>

<p><code>            </code><code>// submenu 가 화면상에 보일때는 위로 보드랍게 접고 아니면 아래로 보드랍게 펼치기</code></p>

<p><code>            </code><code>if</code><code>( submenu.is(</code><code>":visible"</code><code>) ){</code></p>

<p><code>                </code><code>submenu.slideUp();</code></p>

<p><code>            </code><code>}</code><code>else</code><code>{</code></p>

<p><code>                </code><code>submenu.slideDown();</code></p>

<p><code>            </code><code>}</code></p>

<p><code>        </code><code>});</code></p>

<p><code>    </code><code>});</code></p>

<p><code></script></code></p>

<p>

#그누보드5 #영카트5 #php
댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
멀

<ul class="hide"> 이걸로 모두 닫기 되어있자나요

보여줄 곳에선 hide가 없어야겟죠?

while로 반복문 쓰셧네요

원하는 순서에 hide가 안되어있으면 될거 같네요

php나 자바스크립트로 원하시는 펼침을 찾으셔서 hide를 날려주세요

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

답변에 대한 댓글 4개

�
초비입니다
2년 전
class="hide" 이걸 지우니 전체 보이긴하네요.
제가 초보라 첫번째 두번째만 class="hide" 적용안되게 그외에는 다 class="hide" 적용되게 하는방법은 없을까요 ㅠㅠ?
�
멀티트리플
2년 전
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">';
}

이해만 하도록 작성한것이니 응용해보세요
�
엑스엠엘
2년 전
$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?>" >
<?
�
초비입니다
2년 전
와 엑스엠엘님 감사합니다.

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

배
배르만
2년 전

소스 대로만 했을때 펼쳐져 있습니다.

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

답변에 대한 댓글 1개

�
초비입니다
2년 전
제가 적용한 소스인데 여기에서는 닫혀있는데 어느부분을 수정해야할까요

<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>

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

배
배르만
2년 전

예제 페이지에 나온대로 구성하면 펼쳐져 있는것 아닌가요?

</p>

<p><script src="<a href="http://code.jquery.com/jquery.min.js"></script>?" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery.min.js"></script>?</a>

 

<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></p>

<p>

<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></p>

<p>

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

답변에 대한 댓글 1개

�
초비입니다
2년 전
클릭해야지만 펼쳐 집니다

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

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

로그인