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

자바스크립트 문의요..

jasmin2
프로필 보기이 회원 글보기
 · 11년 전 · 736
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
    <!--PG크로스브라우징필수내용 시작-->
    <meta http-equiv="Cache-Control" content="no-cache"/>
    <meta http-equiv="Expires" content="0"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!--PG크로스브라우징필수내용 끝-->
<title>기본 레이아웃</title>
    <!--@css(/layout/basic/css/common.css)--><!--해당 CSS는 쇼핑몰 전체 페이지에 영향을 줍니다. 삭제와 수정에 주의해주세요.-->
    <!--@css(/layout/basic/css/layout.css)-->
    <!-- 스마트디자인에서는 최신 JQuery가 내장되어있습니다. 추가로 호출하면 충돌이 생길 수 있습니다. -->
 <!--@js(/layout/basic/js/basic.js)-->
    <!--@js(/js/common.js)-->
<style type="text/css">
  /*reset*/
 body,ul,ol,li,dl,dt,dd,p,h1,h2,h3,h4,h5,h6{margin:0; padding:0;}
ul,ol{list-style:none;}
img{border:0; vertical-align: top;}
li{float:left; }
#container{position:relative; margin-left:150px; margin-top:200px; width:1024px; height:399px;}
#mas{width:925px; height:265px; position:absolute; top:65px;left:55px; overflow:hidden;}
#gall {position: absolute; width:2000px; height:255px;top:0px;left:-10px; }
#gall li{float:left; width:235px; height:255px; cursor: pointer;}
#g_nav{position:absolute;left:430px;top:370px;float:left; width:151px;height:15px;}
#g_nav img{cursor:pointer;}
#g_nav li {width:13px; height:17px; margin-right:5px; background-image:url(/web/upload/scroll//web/upload/scroll/images/h_b2.gif) no-repeat; cursor:pointer;}
#pre{position: absolute; top:165px; left:10px; cursor: pointer;}
#nex{position:absolute; top:165px; left:985px; cursor:pointer;}
</style>
<!-- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> -->
<script type="text/javascript" src="/web/upload/scroll/images/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function(){
 
 $("#gall li:last").prependTo("#gall");
 //갤러리의 마지막 이미지를 갤러리안의 가장 앞으로 배치
 
 
 $("#gall").css("marginLeft","-230px");
 
 $("#pre").click(function(){//이전 이미지가 슬라이드된후 마지막 이미지를 갤러리안의 젤 앞으로 배치
  $("#gall").animate({
   marginLeft:"+=230px"},"slow","swing",function(){
    $("#gall li:last").prependTo("#gall");    
    $("#gall").css("marginLeft","-230px");
   });
   $("ul").css("listStyle","none");
      $("li").css("listStyle","none");  
  
 });
 
 $("#nex").click(function(){//다음 이미지가 슬라이드된후 젤앞의 이미지를 갤러리안의 젤 마지막으로 배치
  $("#gall").animate({
   marginLeft:"-=230px"},"slow","swing",function(){
    $("#gall li:first").appendTo("#gall");
    $("#gall").css("marginLeft","-230px");
   });
   $("ul").css("listStyle","none");
      $("li").css("listStyle","none");  
 });
})
</script>
</head>
<body id="main">
<div id="accNav">
    <p><a href="#contents">컨텐츠 바로가기</a></p>
</div>
<div id="wrap">
    <!--Header--><!--@import(/layout/basic/header.html)-->
    <hr class="layout" />
    <div id="container"> <img src="/web/upload/scroll/images/scroll_bg.jpg" />
    <div id="mas">
      <div id="gall">
        <ul>&nbsp;&nbsp;
          <li><img src="/web/upload/scroll/images/img1.jpg" onmouseover="this.src='/web/upload/scroll/images/img1_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img1.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img2.jpg" onmouseover="this.src='/web/upload/scroll/images/img2_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img2.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img3.jpg" onmouseover="this.src='/web/upload/scroll/images/img3_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img3.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img4.jpg" onmouseover="this.src='/web/upload/scroll/images/img4_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img4.jpg'" /></li>
    <li><img src="/web/upload/scroll/images/img5.jpg" onmouseover="this.src='/web/upload/scroll/images/img5_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img5.jpg'" /></li>
    <li><img src="/web/upload/scroll/images/img1.jpg" onmouseover="this.src='/web/upload/scroll/images/img1_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img1.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img2.jpg" onmouseover="this.src='/web/upload/scroll/images/img2_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img2.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img3.jpg" onmouseover="this.src='/web/upload/scroll/images/img3_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img3.jpg'" /></li>
          <li><img src="/web/upload/scroll/images/img4.jpg" onmouseover="this.src='/web/upload/scroll/images/img4_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img4.jpg'" /></li>
    <li><img src="/web/upload/scroll/images/img5.jpg" onmouseover="this.src='/web/upload/scroll/images/img5_over.jpg'" onmouseout="this.src='/web/upload/scroll/images/img5.jpg'" /></li>
        </ul>
      </div>
  </div>
  <div id="pre"><img src="/web/upload/scroll/images/left_bt.jpg" /></div>
  <div id="nex"><img src="/web/upload/scroll/images/right_bt.jpg" /></div>
</div>
 
밑의 소스는 생략했구요.
 
http://www.blancdecor.com  사이트 처럼 전광판의 이미지 5개가 시간차를 두고 왼쪽으로 한칸씩 움직이게 하고 싶은데
어떤 소스를 더 넣어야 하나요. 지금은 좌측 우측 버튼을 눌러야 이미지가 움직입니다.
목록
이전글 다음글

댓글 작성

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

로그인하기

게시글 목록

번호 제목
6256
logio는 개발자에게 필수 아이템인듯합니다. 7
6255
네이버 신디케이션을 진행하다가 취소하면 검색노출이 잘 안되나요?
6254
이게 상당히 많이 탐나네요~
19430
기타 PNG파일의 에니메이션에서 검정배경 처리 방법 1
6253
구글 드라이브에 프로그램을 설치 할려는데요....
6252
웹표준 홈페이지 및 html5 등 관련된 교육 pt 가능하신 강사분 찾습니다.
27670
웹표준 홈페이지 및 html5 등 관련된 교육 pt 가능하신 강사분 찾습니다
6249
2014년 법정공휴일 정보입니다. 2
6246
그누보드5에 8단계 카테고리, 7단계지역 붙혀봤습니다. 2
6242
웹접근성 책 추천 부탁드려요.. 3
6241
도로명 주소 변환에 대하여....
19429
JavaScript 자바스크립트로 이미지 롤링 관련 문의드립니다.
6238
구글 , youtube 파싱으로 머리좀 앓고 있습니다. 2
6237
그누보드 기반 사이트 유지보수 의뢰합니다.
19426
웹서버 Zendopcache + ioncube_loaders + mod_security + phpMyAdmin 설치 2
19413
웹서버 CentOS6.5 에 APM (httpd2.4.7 + Mariadb5.5.34 + php5.5.7) 설치 12
19411
OS ssh 특정 IP만 허용하는법 1
6232
동적테이블 사진첨부 받는방법요.. 4
6227
php mysql 연동 문의. 4
6226
[jsp, 표준웹코딩,접근성] 알바 구합니다.
6224
항공권 Open API에 관해서요.... 1
19408
PHP php 개발 공부하려는데 좀알려주세요 2
6223
제작 의뢰드려요 {영카트}
6221
스누피로 가져오는 방법 문의 1
6220
지도 API를 DB와 연동하고 싶은데....
27663
해결 못한것이 있어서 .... 질문 6
6213
요세 작업 중인것입니다. 6
6212
독립몰커스터마이징해주실분 있으신가요~~
27661
퍼블리싱 도와주실분 계신가요? 1
27659
ie 6, 7 - 2가지 1
6209
php로 웹파싱 저작권 질문 2
6203
요즘 재택 구하기가 힘드네요 5
6200
제작의뢰합니다^^ 2
27654
자바스크립트를 해보고 제이쿼리를 해보니 4
6194
그누보드5에 지역 7단계 기능 붙히기 5
6188
속도 빨라지는 방법 뭐 없을까요?? 5
6180
개발자님들 MySql 쿼리 쓰실떄... 7
6173
이게 뭐야 무서워! 2 6
6150
php 구구단~ 22
19407
기타 그누보드사용한 웹 >>모바일적용시키는법
6145
이게 뭐야 무서워! 4
6141
자동으로 글 퍼오는 것은 어떤 방식으로 구동되는 건가요? 3
6138
(포인트) 랜덤을 비율적으로 하기 2
6131
이미지가 왜 안나오는지........... 6
27650
hgroup 대체 방법 좀 알려주세요 3
6128
그누5에 후킹 기능 넣어주세요. 2
6125
css 의 개념 , overload 2
6122
안녕하세요~ 개발자톡에 처음왔어요~ 2
27648
doctype 없는 홈페이지 2개째... 1
6119
[모바일 도메인 관련] htaccess 에서 루트 디렉토리 변경방법 있나요? 2
6114
게시판에 올리지않은 첨부파일... 4
6109
고민 및 질문 좀 봐 주세요. 4
19402
JavaScript 위지윅 에디터 만들때 선택영역 풀리는 문제 4
6108
TBAjax 약간 업데이트 됬습니다.
27647
웹표준 퍼블리싱 잘하시는분 계신가요
6106
페이팔 연동 관련문의 (코드번호) 1
27642
네이버검색결과 화면 질문이요. 4
27637
doctype 설정 안해논 홈페이지 ㄷㄷㄷ 4
6105
당첨자 추첨 프로그램
6101
ssl의 개념정도? 3
6095
쏜다넷 자체서버 보유 DB방식 세팅방법좀 알려주세요 5
6093
ast/c+ 프로그램개발및사이트운영 서울광진 010-9143-141 1
6091
혹시 그누보드 옛날버전 받을 수 있을까요??? 1
6088
ssl 적용관련 질문입니다. 2
27635
「웹 접근성 품질인증기관 지정 및 품질인증 등에 관한 고시」제정안 행정예고 1
27634
weebly.com 과 같은 사이트를 만들면 국내에서 먹힐 까요?
6087
mysql password
27628
DAUM 메인화면에서 클래스명에 #이 붙어있는데 이게 뭘까요?? 5
6083
궁금합니다. 3
6077
정말 많이 궁금해서 올립니다.^^ 5
24562
분발해야 하는 sir 7
27614
에디터 어떤거 쓰시나요? 13
6072
soap 통신법과 wsdl 작성법 배울곳 없나요? 4
6067
도로명 주소 변환 걱정 끝~ 4
6065
도로명 주소 1
19400
기타 모바일 웹에서 자스로 뷰포트 조절하기 1
19399
기타 IE 구분하기
19398
기타 js, css 캐싱 팁
19397
기타 FaceBook 사진 올리면서 태그 같이 넣기
6062
이사이트에 쓰인 유사한 jquery들좀 알수 있을까요? 2
27608
크로스브라우징의 방해요소 90%는 5
6057
폰갭을 배우려고 하는데요.. 4
27606
소리를 보/여/ 드립니다 - 웹접근성을 다뤘네요. 1
19396
JavaScript 롤링 배너 이해하는데 도움이 될것 같아 올립니다
6054
포트폴리오..ㅠㅠ 2
27600
background 포지션 질문 5
6048
개발자분들.이거는 jquery인가요 ? 5
6040
네이버 이미지모자이크 7
6031
흔히 하는 실수 8
6028
php '' 와 ""의 차이 2
6024
네이버 신디케이션 3
27594
모바일웹 퍼블리싱 5
27593
자바스크립트 문의요.. 현재글
6023
도메인 사용 방법에 대한 문의
6018
에디터플러스에서 원하는 색상 값 4
19395
기타 IE 속도 빨라지게 하는 팁입니다.
19394
PHP 게시판 페이지 관련 글입니다.
19390
PHP 간단하게 구현한 파일업로드 소스입니다. 3
19388
JavaScript 멀티 체크박스입니다. 1
19386
기타 웹에서 불가능한것을 가능하게 하기 1
이전 다음
전체 목록