슬라이드 배너 코드 도와주세요

슬라이드 배너 코드 도와주세요

QA

슬라이드 배너 코드 도와주세요

본문

<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');
global $is_admin;

$n_thumb_width = 500; //썸네일 가로 크기
$n_thumb_height = 300; //썸네일 세로 크기
?>

<style>
    table{margin:0 auto;}
    .n_gallery_wrap{width:1200px; margin:30px auto 0;}
    .n_gallery_wrap h1{font-size:20px;}


    .slide_title{font-size:20px;}
</style>

<section class="n_gallery_wrap">
    <div class="n_right_wrap">
        <h1>인테리어예시</h1>
    </div>
</section>

<script type="text/javascript">
    var sliderwidth="1180px"  //스크롤 가로 사이즈
    var sliderheight="<?=$n_thumb_height;?>px"  //스크롤 세로 사이즈
    var slidespeed="4"
    var slidebgcolor="transparent"  // 배경색을 주시려면 #99cc00 등과 같이 바꾸시면 됩니다 !

    var leftarrowimage = "<?php echo $latest_skin_url;?>/img/left.gif";
    var rightarrowimage = "<?php echo $latest_skin_url;?>/img/right.gif";

    var leftrightslide=new Array()
    var finalslide=''

    <?
    for ($i=0; $i<count($list); $i++) {

    //$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $imgwidth , $imgheight);

    $n_thumb = get_list_thumbnail($bo_table, $list[$i]['wr_id'], $n_thumb_width, $n_thumb_height);
    $n_noimg = "$latest_skin_url/img/noimg.gif";
    if($n_thumb['src']) {
      $img_content = $n_thumb['src'];
    } else {
      $img_content = $n_thumb_width;
    }

    ?>
        leftrightslide[<?=$i;?>] = " <A HREF='<?=$list[$i]['href'];?>' target='_blank'><img src='<?=$img_content;?>' border=0 width='<?=$n_thumb_width?>' height='<?=$n_thumb_height?>'  class='slide_img'><span class='slide_title'><?php echo $list[$i]['subject'] ?></span></A> ";
    <?
    }
    ?>

    var imagegap=""
    var slideshowgap=0

    var copyspeed=slidespeed
        leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
    var iedom=document.all||document.getElementById
        if (iedom)
            document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')

    var actualwidth=''
    var cross_slide, ns_slide
    var righttime,lefttime

    function fillup(){
        if (iedom){
            cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2
            cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3
            cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
            actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth
            cross_slide2.style.left=actualwidth+slideshowgap+"px"
        }
        else if (document.layers){
            ns_slide=document.ns_slidemenu.document.ns_slidemenuorange
            ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
            ns_slide.document.write(leftrightslide)
            ns_slide.document.close()
            actualwidth=ns_slide.document.width
            ns_slide2.left=actualwidth+slideshowgap
            ns_slide2.document.write(leftrightslide)
            ns_slide2.document.close()
        }
        lefttime=setInterval("slideleft()",30)
    }
    window.onload=fillup

    function slideleft(){
        if (iedom){
        if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
            cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
        else
            cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"
        if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
            cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
        else
            cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"
        }
        else if (document.layers){
        if (ns_slide.left>(actualwidth*(-1)+8))
            ns_slide.left-=copyspeed
        else
            ns_slide.left=ns_slide2.left+actualwidth+slideshowgap
        if (ns_slide2.left>(actualwidth*(-1)+8))
            ns_slide2.left-=copyspeed
        else
            ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
        }
    }

    function slideright(){
        if (iedom){
        if (parseInt(cross_slide.style.left)<(actualwidth+8))
            cross_slide.style.left=parseInt(cross_slide.style.left)+copyspeed+"px"
        else
            cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth*(-1)+slideshowgap+"px"
        if (parseInt(cross_slide2.style.left)<(actualwidth+8))
            cross_slide2.style.left=parseInt(cross_slide2.style.left)+copyspeed+"px"
        else
            cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth*(-1)+slideshowgap+"px"
        }
        else if (document.layers){
        if (ns_slide.left>(actualwidth*(-1)+8))
            ns_slide.left-=copyspeed
        else
            ns_slide.left=ns_slide2.left+actualwidth+slideshowgap
        if (ns_slide2.left>(actualwidth*(-1)+8))
            ns_slide2.left-=copyspeed
        else
            ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
        }
    }

    function right(){
        if(lefttime){
            clearInterval(lefttime)
            clearInterval(righttime)
            righttime=setInterval("slideright()",30)
        }
    }

    function left(){
        if(righttime){
            clearInterval(lefttime)
            clearInterval(righttime)
            lefttime=setInterval("slideleft()",30)
        }
    }
        document.write('<table width='+sliderwidth+' border="0" cellspacing="0" cellpadding="0">');
        document.write('<tr><td align=center valign=middle width=20><img src='+leftarrowimage+' onMouseover="left(); copyspeed=4" onMouseout="copyspeed=1" style="cursor:hand"></td>')


        if (iedom||document.layers){
            with (document){
                document.write('<td>')
        if (iedom){
            write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
            write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=1">')
            write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
            write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
            write('</div></div>')
        }
        else if (document.layers){
            write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
            write('<layer name="ns_slidemenuorange" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
            write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
            write('</ilayer>')
        }
        document.write('</td>')
        }
    }
    document.write('<td width="20" align=center valign=middle><img src='+rightarrowimage+' onMouseover="right();copyspeed=4" onMouseout="copyspeed=1" style="cursor:hand"></td></tr></table>')
</script>

 

-----------------------------------------------------------------------------------------------------------------

노란색 배경 안에 있는 파란부분을 

1982139228_1538444844.3801.png

이런 레이아웃으로 만들고 싶은데 어떻게 해야할까요..?

고수님들 도와주세요ㅠㅠ

이 질문에 댓글 쓰기 :

답변 1

배너 슬라이드 저런걸로 하지마시고 제이쿼리 라이브러리 보면 bx슬라이드나 플렉스 슬라이드 와우 슬라이드 등등 여러가지 있어요 그걸 이용해서 하는게 쉽게 구현할수있어요

답변을 작성하시기 전에 로그인 해주세요.
전체 294
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT