문제좀 해결해주세요 ㅠㅠ 채택완료
반응형 웹사이트를 제작중입니다.
타 사이트에 소스를 퍼왔습니다.
하지만 홈페이지를 열었을때 비주얼이 보이지 않습니다만 화면을 줄였다 키웠다 하거나 전체화면을 풀었다 했다. 즉 화면의 사이즈가 변하면 비주얼이 나옵니다. 어떻게 해야 할지몰라서 조언부탁드립니다.
<div id="spot_main"></p><p> <div id="slider_t1"></p><p> <ul class="lst_slide"></p><p> <li class="n1"></p><p> <div class="img"><img src="../img/main/spot1.jpg" alt=""></div></p><p> <div class="cont"></p><p> <h1>WEB/MOBILE</h1></p><p> <div class="lst"></p><p> <p>Strategy</p></p><p> <p>Design UI .UX</p></p><p> <p>Program Custom Solution</p></p><p> <p>APP(Application Program)</p></p><p> <p>Responsive Web</p></p><p> <p>Parallax</p></p><p> <a href="index_cont1.asp" class="more">MORE</a></p><p> </div></p><p> </div></p><p> </a></p><p> </li></p><p> </p><p> <li class="n2"></p><p> <div class="img"><img src="/img/main/spot3.jpg" alt=""></div></p><p> <div class="cont"></p><p> <h1>SI SOLUTION</h1></p><p> <div class="lst"></p><p> <p>공공SI 서비스구축</p></p><p> <p>맞춤형 비즈니스 모델 개발</p></p><p> <p>-웹/모바일 서비스 구축</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-전자정부 프레임워크 기반 구축</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-정보포털 서비스 구축</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-포인트통합관리 프로그램</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-쇼핑몰, 폐쇠몰, 웹진, 이메일</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-특허관리, 예약관리</p></p><p> <span class="Apple-tab-span" style="white-space:pre"> </span> <p>-CMS</p></p><p> <a href="index_cont3.asp" class="more">MORE</a></p><p> </div></p><p> </p><p> </div></p><p> </li></p><p> </p><p> <li class="n3"></p><p> <div class="img"><img src="/img/main/spot2.jpg" alt=""></div></p><p> <div class="cont"></p><p> <h1>MAINTENANCE</h1></p><p> <div class="lst"></p><p> <p>SEO(search engine optimization)</p></p><p> <p>Design upgrade</p></p><p> <p>Publishing homeostasis</p></p><p> <p>Security Check</p></p><p> <p>Promotion</p></p><p> <a href="index_cont2.asp" class="more">MORE</a></p><p> </div></p><p> </div></p><p> </li></p><p> </p><p> <li class="n4"></p><p> <div class="img"><img src="/img/main/spot4.jpg" alt=""></div></p><p> <div class="cont"></p><p> <h1>SYSTEM HOSTING</h1></p><p> <div class="lst"></p><p> <p>Ser Maintenance</p></p><p> <p>Web Hosting</p></p><p> <p>Co-Location</p></p><p> <p>Server Hosting</p></p><p> <p>Cloud Hosting</p></p><p> <p>Domain.Mail</p></p><p> <a href="index_cont4.asp" class="more">MORE</a></p><p> </div></p><p> </div></p><p> </li></p><p> </ul></p><p> </div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="down"></p><p> <a href="#main_product"></p><p> <!-- <span>SCROLL DOWN</span>!--></p><p> <span class="after"></span></p><p> </a></p><p> </p><p> </div><!-- //down --></p><p> </div></p><p> <!-- <span class="img on" data-stellar-ratio="-0.05" data-stellar-vertical-offset="-50"><img src="/images/main/spot4.jpg" alt=""></span></p><p> <span class="img" data-stellar-ratio="-0.05" data-stellar-vertical-offset="-50"><img src="/images/main/spot5.jpg" alt=""></span></p><p> <span class="img" data-stellar-ratio="-0.05" data-stellar-vertical-offset="-50"><img src="/images/main/spot6.jpg" alt=""></span></p><p> <div class="bg_cover"></div></p><p> <span class="txt" data-stellar-ratio="0.45" data-stellar-vertical-offset="20"><img src="/images/main/p2_oktomato.png" alt="We must think about tomorrow than today. Offers a little newer and extraordinary service."></span> --></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="main_notice"></p><p> <!-- <h3><img src="main_notice_title.png" alt="News&Notice" /></h3> --></p><p> <!-- <input class="prev" type="image" src="main_btn_prev.png" alt="이전으로" /></p><p> <input class="next" type="image" src="main_btn_next.png" alt="다음으로" /> --></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p> </p><p> <div class="main_notice_list"></p><p> <ul></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n0"><a href="#" >지역 농산물 직거래 스마트 제휴푸드 시스템 구축 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n1"><a href="#" >스마트미디어센터</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n2"><a href="#" >서울시 서울길 운영관리</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n3"><a href="#" >대검찰청 검찰방송 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n4"><a href="#" >보건복지부 저출산고령사회위원회</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n5"><a href="#" >문화관광체육부 아시아문화중심도시</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n6"><a href="#" >AKmall TagOn e-commerce </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n7"><a href="#" >풀무원 회원전용 폐쇄몰 그린체 오픈</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n8"><a href="#" >국립암센터 특허관리정보시스템 고도화 작업</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n9"><a href="#" >한국과학창의재단 무한상상정보넷 고도화 작업</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n10"><a href="#" >뉴스1 반려동물 포탈 “해피펫” 웹사이트 구축 프로젝트</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n11"><a href="#" >2015 ICT 어워드코리아 모바일 부분 미래창조과학부장관상 대상</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n12"><a href="#" >2015 ICT 어워드코리아 UI/UX 부분 한국정보화진흥원장상 금상</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n13"><a href="#" >인터플렉스 웹사이트 리빌딩 오픈</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n14"><a href="#" >풀무원 그린체 리빌딩 프로젝트 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n15"><a href="#" >이마트 에브리데이 유지보수 계약 체결</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n16"><a href="#" >트리니티CC 유지보수 계약 체결</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n17"><a href="#" >한진화학 웹사이트 오픈</a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n18"><a href="#" >LG 생명과학 그로스차트 프로그램 개발 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n19"><a href="#" >머니투데이 아트원 웹사이트 오픈 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><li class="n20"><a href="#" >신세계건설 자유CC 웹사이트 리빌딩 </a></li></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p> <!-- <li><a href="#"><대구>지역수출기업 해외규격인증획득지원사업1...</a></li></p><p> <li><a href="#"><대구>학교종이 땡땡땡2...</a></li></p><p> <li><a href="#"><대구>학교종이 땡땡땡3...</a></li></p><p> <li><a href="#"><대구>학교종이 땡땡땡4...</a></li> --></p><p> </ul></p><p> </div> </p><p> </div><!--main_notice--></p><p> </p><p></div><!-- //spot_main --></p><p></div><!-- //wrap --></p><p><style></p><p> </p><p> </p><p> </p><p> </p><p></style></p><p> </p><p> </p><p><script type="text/javascript"></p><p> var bxSliderSpot = $('#slider_t1 > ul').bxSlider({</p><p> // pager: true,</p><p> // pagerType:'full',</p><p> // autoHidePager: true,</p><p>});</p><p> </p><p>var openWidth = 37;</p><p>var closeWidth = 21;</p><p>var normalWidth = 25;</p><p>var spotSpeed = 300;</p><p>var spotEase = "swing"</p><p>var slideReload = true;</p><p>var slideDestroy = true;</p><p> </p><p> </p><p>var PosResetNum = [0,normalWidth+"%",(normalWidth*2)+"%",(normalWidth*3)+"%"]</p><p>var widthNum = [</p><p> [openWidth+"%", closeWidth+"%", closeWidth+"%", closeWidth+"%"],</p><p> [closeWidth+"%", openWidth+"%", closeWidth+"%", closeWidth+"%"],</p><p> [closeWidth+"%", closeWidth+"%", openWidth+"%", closeWidth+"%"],</p><p> [closeWidth+"%", closeWidth+"%", closeWidth+"%", openWidth+"%"]</p><p>]</p><p>var PosNum = [</p><p> ["0%",openWidth+"%",(openWidth + closeWidth)+"%",(openWidth + (closeWidth*2))+"%"],</p><p> ["0%",closeWidth+"%",(openWidth + closeWidth)+"%",(openWidth + (closeWidth*2))+"%"],</p><p> ["0%",closeWidth+"%",(closeWidth*2)+"%",(openWidth + (closeWidth*2))+"%"],</p><p> ["0%",closeWidth+"%",(closeWidth*2)+"%",(closeWidth*3)+"%"]</p><p>]</p><p>// $("#slider_t1 ul.lst_slide > li").on("click",function(){</p><p>// var url =$(this).find(".more").attr("href");</p><p>// $(location).attr("href",url);</p><p>// });</p><p> </p><p> function sliderT1Height(b){</p><p> var WinWdith = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;</p><p> function resizeT1(){</p><p> var winHeight = $(window).height();</p><p> var headerHeight = $("#header").outerHeight();</p><p> var totalHeight = winHeight - headerHeight;</p><p> </p><p> if(WinWdith > 1100){</p><p> if(slideDestroy){</p><p> bxSliderSpot.destroySlider();</p><p> slideReload = true;</p><p> slideDestroy = false;</p><p> $("#slider_t1 > ul > li").off("mouseenter mouseleave").on("mouseenter mouseleave",sliderEnter).trigger("mouseleave");</p><p> }</p><p> </p><p> $("#spot_main ,#slider_t1 > ul").css("height",totalHeight);</p><p> $("#slider_t1 > ul > li").each(function(){</p><p> var $this = $(this);</p><p> $this.find(".img").css({ marginLeft : -($this.find(".img > img").width()/2) });</p><p> });</p><p> </p><p> </p><p> }else{ //WinWdith</p><p> if(slideReload){</p><p> bxSliderSpot.reloadSlider();</p><p> slideReload = false;</p><p> slideDestroy = true;</p><p> $("#slider_t1 ul.lst_slide > li").off("mouseenter mouseleave",sliderEnter);</p><p> } </p><p> </p><p> $("#spot_main ,#slider_t1 ul.lst_slide,#slider_t1 ul.lst_slide li, #spot_main .bx-viewport").css("height",totalHeight);</p><p> $("#slider_t1 ul.lst_slide li").each(function(){</p><p> var $this = $(this);</p><p> $this.css({ "left":"","height":$this.find(".img > img").height() }).find(".img").css({marginLeft : -($this.find(".img > img").width()/2)}).end()</p><p> .find(".cont").css("margin-top","");</p><p> });</p><p> </p><p> } //if :: WinWdith</p><p> </p><p> }//resizeT1</p><p> </p><p> if (b) {</p><p> $("#spot_main").imagesLoaded(function(){</p><p> resizeT1(true);</p><p> })</p><p> }else{</p><p> resizeT1(true);</p><p> }//if::b</p><p> </p><p> }</p><p> </p><p> </p><p>function sliderEnter(e){</p><p> if(e.type == "mouseenter"){</p><p> </p><p> var $this = $(this);</p><p> var num = $this.index();</p><p> var cont = $this.find(".cont");</p><p> var lstHeight = cont.find(".lst").outerHeight();</p><p> cont.find(".lst").stop().fadeIn(300);</p><p> cont.find("h1").css({"width":"70%"});</p><p> cont.stop().animate({"margin-top":-(lstHeight / 2)},300);</p><p> for (var i = 0; i < $("#slider_t1 > ul > li").length; i++) {</p><p> $("#slider_t1 > ul > li:eq("+i+")").stop().animate({</p><p> "width":widthNum[num][i],</p><p> "left":PosNum[num][i]</p><p> },spotSpeed,spotEase)</p><p> };</p><p> </p><p> }else{</p><p> var $this = $(this);</p><p> var num = $this.index();</p><p> var cont = $this.find(".cont");</p><p> $this.find(".lst").stop().fadeOut(300);</p><p> cont.stop().animate({"margin-top":-20},300);</p><p> cont.find("h1").stop().css({"width":""});</p><p> for (var i = 0; i < $("#slider_t1 > ul > li").length; i++) {</p><p> $("#slider_t1 > ul > li:eq("+i+")").stop().animate({</p><p> "width":normalWidth+"%",</p><p> "left":PosResetNum[i]</p><p> },spotSpeed,spotEase)</p><p> };</p><p> }</p><p> </p><p>}</p><p> </p><p> </p><p> </p><p> $(window).resize(function(){</p><p> sliderT1Height(false);</p><p> });</p><p> sliderT1Height(true);</p><p> </p><p> </p><p> if( isie7 || isie8 ){}else{</p><p> if(!Modernizr.touch){ </p><p> // $( window ).stellar({</p><p> // positionProperty :"transform"</p><p> // // hideDistantElements: false,</p><p> // // horizontalScrolling: false,</p><p> // // responsive: true</p><p> // }); </p><p> }</p><p>};</p><p>// var stellarTimeout;</p><p>// $(window).resize(function() {</p><p>// clearInterval(stellarTimeout);</p><p>// stellarTimeout = setTimeout(function(){</p><p>// $( window ).stellar('refresh');</p><p>// },300);</p><p> </p><p> </p><p> </p><p> </p><p>// });</p><p> </p><p> var notice_list = $(".main_notice_list"); </p><p> var notice_interval;</p><p> var detail ={ </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>speed:1000,</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>l_height:15,</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>delay:4000,</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>easing:"easeInCubic"</p><p> }</p><p> function notice_motion(c,p){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(c == "next"){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> notice_list.find("ul").stop().animate({"top":-(detail.l_height)},detail.speed,detail.easing,function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).find("li:first-child").clone().insertAfter($(this).find("li:last-child"))</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).find("li:first-child").remove().end().css("top",0);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> })</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> notice_list.find("ul li:last-child").clone().insertBefore(notice_list.find("ul li:first-child")).parent().css({"top":-(detail.l_height)});</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> notice_list.find("ul").stop().animate({"top":0},detail.speed,detail.easing,function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).find("li:last-child").remove();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> })</p><p><span class="Apple-tab-span" style="white-space:pre"> </span> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p> $(".main_notice_list > ul > li").off("click").on("click",noticeClick);</p><p> }//motion</p><p> function notice_run(){ notice_interval = setInterval(notice_motion_setintervarl,detail.delay); }//run</p><p> function notice_stop(){clearInterval(notice_interval); }//stop</p><p> function notice_motion_setintervarl(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>notice_motion("next");</p><p> }//interval</p><p> </p><p> </p><p> /*$(".main_notice .prev,.main_notice .next").click(function(e){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var ac = $(this).attr("class");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>notice_motion(ac);</p><p> }).parent().hover(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>notice_stop();</p><p> },function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>notice_run();</p><p> });*/</p><p> </p><p> $(".main_visual ul li").hover(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var $m_tab = $(this).find("img");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$m_tab.attr("src",$m_tab.attr("src").split("_off").join("_on"));</p><p> },function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var $m_tab = $(this).find("img");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$m_tab.attr("src",$m_tab.attr("src").split("_on").join("_off"));</p><p> })</p><p> notice_run();</p><p> </p><p> </p><p></script>
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
Expert
9년 전
소스와 화면을 확인해야 하는 부분이라 텍스트로는 어떠한 부분을 원하시는건지 파악이 되지 않고 소스도 테스트 하며 확인이 되어야 하는 부분입니다.
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인전체 질문 목록
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
채택
답변대기
답변대기
답변대기
답변대기
채택
채택
답변대기
답변대기
답변대기
채택