그누보드 QA - 안녕하세요 ^^ 익스플로러 관련 질문입니다.

안녕하세요 ^^ 익스플로러 관련 질문입니다.

CUPA 홈페이지 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

홈페이지 자기소개 전체게시물 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2013.08.26 17:37:58 조회 4687 (124.♡.♡.164)

본문

익스플로어 9를 기준으로 홈페이지를 만들어놨는데, 10으로 업데이트되면서 화면에 보이는게 깨져버리더라구요, 이전 질문글에서 답변해주신분이 css를 버젼별로 적용할수 있는 방법을 알려주셨는데, 이럴경우엔 css를 각 버젼에 맞게 2개를 작성해놓고 각 버젼에 맞게 사용해야되는건가요?

그리고 현재 주소가 http://mungge1523.cafe24.com/gnuboard4 여기인데 메인화면 맨윗쪽
오른쪽에 보시면 자바스크립트로 마우스오버했을시 배너 그림이 바뀌며 마우스동작이 없을경우 지정해놓은 시간에 따라 자동으로 차례대로 배너가 바뀌는 부분이 있습니다.
(10에서 들어오시는분들은 아마 메뉴가 안보이실겁니다)

이런경우는 자바스크립트를 10에맞게 다시 작성해야하는건가요? 원본은

<script type="text/javascript">

function
HotDealView(id){
this.section=$(id);
this.lefts=$('dt a',this.section);
this.rightPannel=$('dd li',this.section);
this.rights=$('a',this.rightPannel);

this.indexOnCurrent=1 - 1;

this.initFlag=false;
};

HotDealView.rightOnArrow='span';
HotDealView.rightOnArrowElementString='<span></span>';

HotDealView.prototype.init=function(){
if(this.initFlag){
return;
}
var $this=this;
$this.on(this.indexOnCurrent);
$this.rights.mouseover(function(){
var index=$this.rights.index(this);
$this.on(index);
});

this.rights.click(function(){
var $this=$(this);
cClickGo($this.attr('gubun'),$this.attr('loc'),$this.attr('sloc'),$this.attr('order'),$this.attr('href'));
return false;
});

this.lefts.click(function(){
var $this=$(this);
cClickGo($this.attr('gubun'),$this.attr('loc'),$this.attr('sloc'),$this.attr('order'),$this.attr('href'));
return false;
});
this.initFlag=true;
};

HotDealView.prototype.on=function(index,after){
index=index%this.rights.size();
this.lefts.removeClass('on').eq(index).addClass('on');
this.rights
.removeClass('on')
.siblings().filter(HotDealView.rightOnArrow).remove();

$(this.rights).eq(index).addClass('on').after($(HotDealView.rightOnArrowElementString));

this.indexOnCurrent=index;

if(typeof(after) == 'function'){
after(index,this);
}
return index;
};

function
RollingHotDealView(view){
this.view=view;
this.timesOnRolling=1 - 1;
this.timeForInterval=-1;

this.view.init();
};

RollingHotDealView.prototype.start=function(interval){
interval=interval||3000;
var $this=this;
$this.view.lefts.mouseover(function(){
$this.shutdown();
}).mouseout(function(){
$this.timeForInterval=setInterval(function(){
$this.view.on($this.timesOnRolling++);
},interval);
});
$this.view.rights.mouseover(function(){
$this.timesOnRolling=$this.view.rights.index(this)+1;
$this.shutdown();
}).mouseout(function(){
$this.timeForInterval=setInterval(function(){
$this.view.on($this.timesOnRolling++);
},interval);
});

$this.timeForInterval=setInterval(function(){
$this.view.on($this.timesOnRolling++);
},interval);
};

RollingHotDealView.prototype.shutdown=function(){
clearInterval(this.timeForInterval);
};

var rollingView=new RollingHotDealView(new HotDealView('#todayHotDeal'));
rollingView.start(2000);

</script>

<div id="todayHotDeal">
<dl>
<dt>
<a id="thd1"
href="/deal.pang?coupang=36344341&areacode=MB&order=1"
gubun="MAIN"
loc="HOT_DEALX6_LEFT"
sloc="1"
order="1"
class="on" >
<img src="http://mungge1523.cafe24.com/gnuboard4/img/mainbanner/mainbanner1.jpg" width="482" height="290" border="0" title="" alt="" />
</a>
<a id="thd2"
href="/deal.pang?coupang=36532370&areacode=MB&order=2"
gubun="MAIN"
loc="HOT_DEALX6_LEFT"
sloc="1"
order="2"
>
<img src="http://mungge1523.cafe24.com/gnuboard4/img/mainbanner/mainbanner2.jpg" width="482" height="290" border="0" title="" alt="" />
</a>
<a id="thd3"
href="/deal.pang?coupang=36289415&areacode=MB&order=3"
gubun="MAIN"
loc="HOT_DEALX6_LEFT"
sloc="1"
order="3"
>
<img src="http://mungge1523.cafe24.com/gnuboard4/img/mainbanner/mainbanner3.jpg" width="482" height="290" border="0" title="" alt="" />
</a>
<a id="thd4"
href="/deal.pang?coupang=36471193&areacode=MB&order=4"
gubun="MAIN"
loc="HOT_DEALX6_LEFT"
sloc="1"
order="4"
>
<img src="http://mungge1523.cafe24.com/gnuboard4/img/mainbanner/mainbanner4.jpg" width="482" height="290" border="0" title="" alt="" />
</a>
<p class="tsBand"></p>
</dt>
<dd>
<ul>
<li>
<a id="thdm1" class="x"
href="/deal.pang?coupang=36344341&areacode=MB&order=1"
gubun="MAIN"
loc="HOT_DEALX6_RIGHT"
sloc="1"
order="1"
class="on" >
</a>
</li>
<li>
<a id="thdm2" class="x"
href="/deal.pang?coupang=36532370&areacode=MB&order=2"
gubun="MAIN"
loc="HOT_DEALX6_RIGHT"
sloc="1"
order="2"
>
</a>
</li>
<li>
<a id="thdm3" class="x"
href="/deal.pang?coupang=36289415&areacode=MB&order=3"
gubun="MAIN"
loc="HOT_DEALX6_RIGHT"
sloc="1"
order="3"
>
</a>
</li>
<li>
<a id="thdm4" class="x"
href="/deal.pang?coupang=36471193&areacode=MB&order=4"
gubun="MAIN"
loc="HOT_DEALX6_RIGHT"
sloc="1"
order="4"
>
</a>
</li>
</ul>
</dd>
</dl>
</div>