이미지 롤링 문제

가을이군요

· 13년 전 · 조회 1547 1547 · 댓글 6 6

링크

http://sir.co.kr/bbs/board.php?bo_table=g4_plugin&wr_id=1398&page=2&sca=&sfl=&stx=&spt=0&page=2&cwin=#c_1527

꼬을님이 올려주신 플러그인 을 메인에 적용시켰습니다.

1. 크롬에서는 잘 움직이는데 ie 에서는 고정으로 보입니다.
ie 에서도 움직이게 하려면 어디를 고쳐야 하나요?

2. ["/main_banner/main1.jpg","http://google.com"]
이렇게 이미지를 나오게는 했는데... 클릭시 링크로 이동은 됩니다. 링크 이동시 새창으로 열수 있도록 좀 도와 주시기 바랍니다.

댓글 작성

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

로그인하기

댓글 6개

가을이군요

프로필 보기 이 회원 글보기

13년 전

<!doctype html><html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>main banner</title>
<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
</head>

<body topmargin="20" leftmargin="20">
<style>
.RollingImg{
display:inline-block;
// float:left;
// border: 1px solid #CCC;
width:250px;
height:310px;
}
.RollingImg:hover{
opacity: .5;
}
.RollingSmalling{
margin-left: -180px;
}
#DvRollingImage{
border: 0px solid #000;
width:970px;
height:310px;
overflow:hidden;
white-space:nowrap;
}
</style>
<script>
var eOnMouse = false;
var sItemList = [
["/main_banner/main1.jpg","google.com"]
,["/main_banner/main2.jpg","nate.com"]
,["/main_banner/main3.jpg","nate.com"]
,["/main_banner/main4.jpg","naver.com"]
,["/main_banner/main5.jpg","yahoo.co.kr"]
,["/main_banner/main6.jpg","daum.net"]
,["/main_banner/main7.jpg","google.com"]
,["/main_banner/main8.jpg","nate.com"]
];
var sItemIdx = 0;

$(function() {
// Handler for .ready() called.

var sHTML = "";

for(var i=0 ; i<sItemList.length ; i++ )
{
if(i)
sHTML += "<div class='RollingImg'><a href='"+sItemList[i][1]+"'><img src='"+sItemList[i][0]+"' border='0'></a></div>";
else
sHTML += "<div class='RollingImg RollingSmalling'><a href='"+sItemList[i][1]+"'><img src='"+sItemList[i][0]+"' border='0'></a></div>";
}

$("#DvRollingImage").html(sHTML);

var ti= setTimeout("FnMovingSlider()",50);

$("#DvRollingImage").mouseover(function(){
eOnMouse = true;
}).mouseout(function(){
eOnMouse = false;
var ti= setTimeout("FnMovingSlider()",50);
});

});

function FnMovingSlider()
{
var wid = $(".RollingSmalling").innerWidth();

if(wid > 1)
{
wid = wid-1;
$(".RollingSmalling").css("width", wid );
}else{
$(".RollingSmalling")
.next().addClass("RollingSmalling")
.prev().remove()
wid = $(".RollingSmalling").innerWidth();
var htmlStr = $("#DvRollingImage").html();
$("#DvRollingImage").html(htmlStr + "<div class='RollingImg'><a href='"+sItemList[sItemIdx][1]+"'><img src='"+sItemList[sItemIdx][0]+"' border='0'></a></div>");

sItemIdx++;
if(sItemIdx >= sItemList.length)
sItemIdx=0;
}

if( !eOnMouse )
var ti= setTimeout("FnMovingSlider()",50);

}
</script>
<div id="DvRollingImage"></div>
</body>
</html>

손좀 봐주세요. ^^;

균이

프로필 보기 이 회원 글보기

13년 전

한두군데 고쳐서 IE에서 사용할 수 있는게 아닙니다
이미지 스크롤은 자료실에 수두룩할텐데 다른 걸로 해보세요

링크 새창이야 _blank만 추가하면 될테죠
<a href='"+sItemList[i][1]+"' target=_blank>

가을이군요

프로필 보기 이 회원 글보기

13년 전

균이님 댓글 감사합니다.
그런데 꼬을님 올려주신 플러그인은 테스트 페이지가 익스에서도 잘 움직이거든요.
그래서 저도 잘 움직일거라 믿었는데 그게 아니네요. ㅎㅎ 그래도 누군가 댓글 달아주셔서 감사하게 생각하고 포기하도록 하겠습니다. 감사합니다.

균이

프로필 보기 이 회원 글보기

13년 전

소스를 처음부터 끝까지 복사하지말고 이렇게 해보세요

<html> ~ </html>까지 몽땅 복사하지말고 <style>부터 </body> 바로 윗줄 까지 붙여넣기

hesd.sub.php 에서 doctype부분을 아래 코드로 변경
<!doctype html><html>

수정
.RollingImg:hover{
opacity: .5; filter:alpha(opacity=50);
}

변경
var sItemIdx = 0;
var ti;

$(function() {
// Handler for .ready() called.

var sHTML = "";

for(var i=0 ; i<sItemList.length ; i++ )
{
if(i)
sHTML += "<div class='RollingImg'><a href='"+sItemList[i][1]+"'><img src='"+sItemList[i][0]+"' border='0'></a></div>";
else
sHTML += "<div class='RollingImg RollingSmalling'><a href='"+sItemList[i][1]+"'><img src='"+sItemList[i][0]+"' border='0'></a></div>";
}

$("#DvRollingImage").html(sHTML);

ti= setTimeout("FnMovingSlider()",50);

$("#DvRollingImage").mouseover(function(){
eOnMouse = true;
clearTimeout(ti);
}).mouseout(function(){
eOnMouse = false;
ti= setTimeout("FnMovingSlider()",50);
});
});

function FnMovingSlider()
{
var wid = $(".RollingSmalling").innerWidth();

if(wid > 2)
{
wid = wid-1;
$(".RollingSmalling").css("width", wid );
}else{
$(".RollingSmalling").next().addClass("RollingSmalling").prev().remove()
wid = $(".RollingSmalling").innerWidth();
var htmlStr = $("#DvRollingImage").html();
$("#DvRollingImage").html(htmlStr + "<div class='RollingImg'><a href='"+sItemList[sItemIdx][1]+"'><img src='"+sItemList[sItemIdx][0]+"' border='0'></a></div>");

sItemIdx++;
if(sItemIdx >= sItemList.length) sItemIdx=0;
}

if( !eOnMouse )
ti= setTimeout("FnMovingSlider()",10);

}

가을이군요

프로필 보기 이 회원 글보기

13년 전

균이님 감사합니다.
제가 이쪽으로 까막눈이다보니 잘 안되네요.

이리저리 만지다가 약간 움직이기는 했습니다.
꼬을님이 올려주신 파일 원본은 j_rolling.htm 인데
그걸 j_rolling.php 로 저장해서

<? include_once("$g4[path]/include/j_rolling.php"); ?>

이렇게 불러냈었거든요.
그러다가 혹시나 해서

<? include_once("$g4[path]/include/j_rolling.htm"); ?>

이렇게 파일명을 htm 으로 바꿨더니 익스에서도 조금 움직(이다 말아버립니다.) 합니다.

아무래도 .... 뭐가 뭔지 모르겠습니다. ㅎㅎ ;;;;

아무튼 이렇게 신경써 주시고 댓글까지 달아주셔서 무척 감사하게 생각합니다.
감사합니다. ^^

가을이군요

프로필 보기 이 회원 글보기

13년 전

아.. 그리고 혹시 이게 관련이 있는지 모르겠네요.

처음 그누보드 설치하고 자동등록방지 코드가 보이질 않아서..
호스팅 업체에서 그누보드를 덧씌워주었더니 코드가 보였습니다.

게시글 목록

번호	제목	글쓴이	조회	날짜
284508	네이버에서 신디케이션 전체게시물이 보이지않는다며 답변이왔습니다T.T 12	유아이	17,728	11년 전
284499	문의글을 엑셀로 정리해서 달라는데요 mysql 에서 내보내기하면 한글다깨지는데요 4	앱보드	12,551	11년 전
284492	최근 로그인한 회원이 리스트 검색시 리스트의 최상위로... 5	alexseo	10,186	11년 전
284490	포인트랭크 해결 좀 해주세요 ㅜㅜ 7	제씨	10,911	11년 전
284484	포인트 랭크 질문 좀 드리겠습니다. 제발 부탁 좀 드리겠습니다 해결좀해주세요 ㅜㅜ 6	제씨	10,486	11년 전
284481	robots.txt 와 신디케이션 1	아썸	11,844	11년 전
284478	핸드폰으로 pc용 접속하면.... 화면사이즈문제 3	네오빡스	15,029	11년 전
284476	혹시 http://www.appsgeyser.com 여기에서.....	스타크루즈	11,481	11년 전
284474	이런 최신글 있을까요? 3	kimch	11,597	11년 전
284472	불당썸 사용 그림엑박 1	연금술샤	11,419	11년 전
284470	도메인 변경후 이미지 깨짐 2	호텔천사	12,269	11년 전
284458	폼메일전송 메일보내는방법좀요 2	별을기다리며	14,431	11년 전
284457	로그인,로그아웃,회원가입 스킨적용 및 연동방법좀요ㅠ 2	별을기다리며	11,923	11년 전
284454	회원가입에 필요한 파일? 2	MJEI	9,692	11년 전
284453	초보 게시판 관련 질문좀 드립니다. 2	장미란	10,564	11년 전
284447	카운트 갯수 구할때요 limit 이 안먹히는데요 왜그런가요 ㅎㅎ? 리밋할려면 어떻게 해야할까요?? 2	앱보드	16,397	11년 전
284446	회원가입시 아이디에 하이픈 - 사용하는 방법을 가르쳐주세요 2	닷넷	10,449	11년 전
284444	리스트 게시글 묶음처리 2	뽁스	9,127	11년 전
284441	아이핀 연동할때 세션값 변경되는 현상 1	비앙이	10,567	11년 전
284440	셀렉트문은 하나만 사용하고요. 3	alexseo	5,586	11년 전

1 2 3

전체 목록