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

자꾸 같은문제로 죄송합니다. 채택완료

디자인아루즈 5년 전 조회 1,807

도와주세요

사이트를 만들고 있는데 같은 문제로 계속 문제가 샐깁니다.

수정해야할 버튼은 bt-roll입니다 동그란버튼을 중앙으로 오게해야 하는데

<div style="width: 100%x; valign: top ; margin:0 text-align: center;">로 해도 안됩니다

</p>

<p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank" rel="noopener noreferrer">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>"><a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank" rel="noopener noreferrer">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a></a>">

<html xmlns="<a href="<a href="http://www.w3.org/1999/xhtml" target="_blank" rel="noopener noreferrer">http://www.w3.org/1999/xhtml</a>"><a href="http://www.w3.org/1999/xhtml" target="_blank" rel="noopener noreferrer">http://www.w3.org/1999/xhtml</a></a>">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="icon" type="image/png" href="<a href="<a href="https://example.com/favicon.png" target="_blank" rel="noopener noreferrer">https://example.com/favicon.png</a>"><a href="https://example.com/favicon.png" target="_blank" rel="noopener noreferrer">https://example.com/favicon.png</a></a>">

<link rel="shortcut icon" href="favicon.ico" type="image/x-ico" />

<title>SUNFLOWER ENERGY</title>

<style type="text/css">

body {

 margin-left: 0px;

 margin-top: 0px;

 margin-right: 0px;

 margin-bottom: 0px;

}

#apDiv1 {

 position: absolute;

 top: 90px;

 width: 433px;

 height: 32px;

 z-index: 1;

 visibility: hidden;

}

#apDiv2 {

 position: absolute;

 top: 90px;

 width: 442px;

 height: 30px;

 z-index: 2;

 visibility: hidden;

}

#apDiv3 {

 position: absolute;

 top: 90px;

 width: 505px;

 height: 32px;

 z-index: 3;

 visibility: hidden;

}

#apDiv4 {

 position: absolute;

 top: 90px;

 width: 220px;

 height: 31px;

 z-index: 4;

 visibility: hidden;

}

#mainmenu {

 position: absolute;

 top: 150px;

 width: 506px;

 height: 505px;

 z-index: 5;

 visibility: visible;

}

</style>

<SCRIPT language=javascript>

<!--

function getCookie( name ){

   var nameOfCookie = name + "=";

   var x = 0;

   while ( x <= document.cookie.length ){

        var y = (x+nameOfCookie.length);

        if ( document.cookie.substring( x, y ) == nameOfCookie ) {

             if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 )

                  endOfCookie = document.cookie.length;

             return unescape( document.cookie.substring( y, endOfCookie ) );

        }

        x = document.cookie.indexOf( " ", x ) + 1;

        if ( x == 0 )

            break;

    }

return "";

}</p>

<p>

 if ( getCookie( "Notice[1]" ) != "done[1]" ){

window.open ('pop1.html','english1','left=32,top=112,width=800, height=568,scrollbars=no,toolbars=no,resizable=0');  

}</p>

<p>//-->

</SCRIPT>

<script type="text/javascript">

function MM_swapImgRestore() { //v3.0

  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}

function MM_preloadImages() { //v3.0

  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}</p>

<p>function MM_findObj(n, d) { //v4.01

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

  if(!x && d.getElementById) x=d.getElementById(n); return x;

}</p>

<p>function MM_swapImage() { //v3.0

  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

function MM_showHideLayers() { //v9.0

  var i,p,v,obj,args=MM_showHideLayers.arguments;

  for (i=0; i<(args.length-2); i+=3)

  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];

    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }

    obj.visibility=v; }

}

</script>

</head></p>

<p><body onload="MM_preloadImages('sunflimg/topbtn01o.gif','sunflimg/topbtn02o.gif','sunflimg/topbtn03o.gif','sunflimg/topbtn04o.gif','sunflimg/topbtn05o.gif','sunflimg/topbtns01o.gif','sunflimg/topbtns02o.gif','sunflimg/topbtns03o.gif','sunflimg/topbtns2-01o.gif','sunflimg/topbtns2-02o.gif','sunflimg/topbtns3-01o.gif','sunflimg/topbtns3-02o.gif','sunflimg/topbtns3-03o.gif','sunflimg/topbtns3-04o.gif','sunflimg/topbtns3-05o.gif','sunflimg/topbtns5-01o.gif','sunflimg/topbtns5-02o.gif','sunflimg/mainbtn01o.png','sunflimg/mainbtn03o.png','sunflimg/mainbtn04o.png','sunflimg/topbtns04o.gif','sunflimg/mainbtn02o.png')"></p>

<p> </p>

<p> </p>

<p><table width="100%" height="100%"border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td align="center" valign="top"><table width="1200" border="0" cellspacing="0" cellpadding="0">

      <tr>

        <td><table width="1200" bg background="sunflimg/top_bg.gif"border="0" cellspacing="0" cellpadding="0">

          <tr>

            <td width="351" valign="bottom"><a href="../../index.html"><img src="sunflimg/logo.gif" width="351" height="58" /></a></td>

            <td width="849"><table width="666" border="0" cellspacing="0" cellpadding="0">

              <tr>

                <td><img src="sunflimg/top_cell01.gif" width="38" height="33" /></td>

              </tr>

              <tr>

                <td><table width="666" border="0" cellspacing="0" cellpadding="0">

                  <tr>

                    <td width="116"><div id="apDiv1">

  <table width="200" border="0" cellspacing="0" cellpadding="0">

    <tr>

      <td width="121"><a href="../../p1-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn01','','sunflimg/topbtns01o.gif',1)"><img src="sunflimg/topbtns01.gif" width="121" height="27" id="sbtn01" /></a></td>

      <td width="79"><a href="../../p1-2.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn02','','sunflimg/topbtns02o.gif',1)"><img src="sunflimg/topbtns02.gif" width="118" height="27" id="sbtn02" /></a></td>

      <td width="79"><a href="../../p1-4.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('tbtn04','','sunflimg/topbtns04o.gif',1)"><img src="sunflimg/topbtns04.gif" name="tbtn04" width="115" height="27" id="tbtn04" /></a></td>

      <td width="79"><a href="../../p1-3.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn03','','sunflimg/topbtns03o.gif',1)"><img src="sunflimg/topbtns03.gif" width="86" height="27" id="sbtn03" /></a></td>

    </tr>

  </table>

</div><a href="../../p1-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('btn01','','sunflimg/topbtn01o.gif',1)"><img src="sunflimg/topbtn01.gif" name="btn01" width="112" height="58" id="btn01" onmouseover="MM_showHideLayers('apDiv1','','show','apDiv2','','hide','apDiv3','','hide','apDiv4','','hide')" /></a></td>

                    <td width="1"><img src="sunflimg/menubar.gif" alt="" width="1" height="58" /></td>

                    <td width="140"><div id="apDiv2">

  <table width="200" border="0" cellspacing="0" cellpadding="0">

    <tr>

      <td width="82"><a href="../../p2-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn04','','sunflimg/topbtns2-01o.gif',1)"><img src="sunflimg/topbtns2-01.gif" width="82" height="27" id="sbtn04" /></a></td>

      <td width="118"><a href="../../p2-2.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtns05','','sunflimg/topbtns2-02o.gif',1)"><img src="sunflimg/topbtns2-02.gif" width="175" height="27" id="sbtns05" /></a></td>

    </tr>

  </table>

</div><a href="../../p2-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('btn02','','sunflimg/topbtn02o.gif',1)"><img src="sunflimg/topbtn02.gif" width="136" height="58" id="btn02" onmouseover="MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide')" /></a></td>

                    <td width="1"><img src="sunflimg/menubar.gif" alt="" width="1" height="58" /></td>

                    <td width="135"><div id="apDiv3">

  <table width="453" border="0" cellspacing="0" cellpadding="0">

    <tr>

      <td width="90"><a href="../../p3-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn06','','sunflimg/topbtns3-01o.gif',1)"><img src="sunflimg/topbtns3-01.gif" name="sbtn06" width="90" height="27" id="sbtn06" /></a></td>

      <td width="100"><a href="../../p3-2.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn07','','sunflimg/topbtns3-02o.gif',1)"><img src="sunflimg/topbtns3-02.gif" name="sbtn07" width="100" height="27" id="sbtn07" /></a></td>

      <td width="100"><a href="../../p3-3.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn08','','sunflimg/topbtns3-03o.gif',1)"><img src="sunflimg/topbtns3-03.gif" name="sbtn08" width="100" height="27" id="sbtn08" /></a></td>

      <td width="82"><a href="../../p3-4.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn09','','sunflimg/topbtns3-04o.gif',1)"><img src="sunflimg/topbtns3-04.gif" name="sbtn09" width="82" height="27" id="sbtn09" /></a></td>

      <td width="81"><a href="../../p3-5.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn010','','sunflimg/topbtns3-05o.gif',1)"><img src="sunflimg/topbtns3-05.gif" name="sbtn010" width="82" height="27" id="sbtn010" /></a></td>

    </tr>

  </table>

</div><a href="../../p3-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('btn03','','sunflimg/topbtn03o.gif',1)"><div id="mainmenu">

              <table width="200" border="0" cellspacing="27">

                <tr>

                  <td><a href="../../p2-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('mbtn01','','sunflimg/mainbtn01o.png',1)"><img src="sunflimg/mainbtn01.png" width="209" height="209" id="mbtn01" /></td>

                  <td><a href="../../p3-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('mbtn02','','sunflimg/mainbtn02o.png',1)"><img src="sunflimg/mainbtn02.png" width="209" height="209" id="mbtn02" /></a></td>

                </tr>

                <tr>

                  <td><a href="../../p4-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('mbtn03','','sunflimg/mainbtn03o.png',1)"><img src="sunflimg/mainbtn03.png" width="209" height="209" id="mbtn03" /></a></td>

                  <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('mbtn04','','sunflimg/mainbtn04o.png',1)"><img src="sunflimg/mainbtn04.png" width="209" height="209" id="mbtn04" /></a></td>

                </tr>

              </table>

            </div>

<a href="../../p3-1.html"><img src="sunflimg/topbtn03.gif" name="btn03" width="134" height="58" id="btn03" onmouseover="MM_showHideLayers('apDiv1','','hide','apDiv2','','hide','apDiv3','','show','apDiv4','','hide')" /></a></td>

                    <td width="1"><img src="sunflimg/menubar.gif" alt="" width="1" height="58" /></td>

                    <td width="134"><a href="../../p4-1.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('btn04','','sunflimg/topbtn04o.gif',1)"><img src="sunflimg/topbtn04.gif" name="btn04" width="134" height="58" id="btn04" onmouseover="MM_showHideLayers('apDiv1','','hide','apDiv2','','hide','apDiv3','','hide','apDiv4','','hide')" /></a></td>

                    <td width="1"><img src="sunflimg/menubar.gif" alt="" width="1" height="58" /></td>

                    <td width="138"><div id="apDiv4">

  <table width="159" border="0" cellspacing="0" cellpadding="0">

    <tr>

      <td width="68"><a href="../../gnuboard/bbs/board.php?bo_table=notice" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn011','','sunflimg/topbtns5-01o.gif',1)"><img src="sunflimg/topbtns5-01.gif" width="68" height="27" id="sbtn011" /></a></td>

      <td width="91"><a href="../../gnuboard/bbs/board.php?bo_table=download" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('sbtn012','','sunflimg/topbtns5-02o.gif',1)"><img src="sunflimg/topbtns5-02.gif" width="92" height="27" id="sbtn012" /></a></td>

    </tr>

  </table>

</div><a href="../../gnuboard/bbs/board.php?bo_table=notice" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('btn05','','sunflimg/topbtn05o.gif',1)"><img src="sunflimg/topbtn05.gif" width="146" height="58" id="btn05" onmouseover="MM_showHideLayers('apDiv1','','hide','apDiv2','','hide','apDiv3','','hide','apDiv4','','show')" /></a></td>

                  </tr>

                  </table></td>

              </tr>

            </table></td>

          </tr>

        </table></td>

      </tr>

      <tr>

        <td><table width="1200" height="600" bg background="sunflimg/mainbg.jpg" border="0" cellspacing="0" cellpadding="0">

          <tr>

            <td align="left" valign="top"><!DOCTYPE html>

<html lang="ko-KR">

<head>

 <title>UI Laboratory</title>

 <meta charset="utf-8" /></p>

<p> <link rel="stylesheet" type="text/css" href="common.css" />

 <script type="text/javascript" src="jquery-1.7.1.min.js"></script></p>

<p> <!--[if lt IE 9]>

  <script src="<a href="<a href="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script" target="_blank" rel="noopener noreferrer">http://html5shiv.googlecode.com/svn/trunk/html5.js"></script</a>"><a href="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script" target="_blank" rel="noopener noreferrer">http://html5shiv.googlecode.com/svn/trunk/html5.js"></script</a></a>>

 <![endif]-->

<style type="text/css">

 .mainimg-wrap {position:relative; width:572px; height:448px; overflow:hidden;}

 .mainimg-wrap ul.mainimg {position:absolute;}

 .mainimg-wrap ul.mainimg li {float:left; width:572px;}

 

 ul.bt-roll {width:572px; margin:0; margin-top:0px;}

  ul.bt-roll li {float:left; margin-right:5px;}

   ul.bt-roll { list-style: none; display: inline-block;  margin: 0  padding: 0; }

ul.bt-roll {width:572px; margin:0 ; margin-top:-10px;}

 ul.bt-roll li {display: inline-block; margin-right:5px;}

  

</style>

</head>

<body></p>

<p><div class="mainimg-wrap">

 <ul class="mainimg clfix">

  <li><a href="#"><img src="../../sunflimg/mainimg01.png" alt="" width="572" height="448"></a></li>

  <li><a href="#"><img src="../../sunflimg/mainimg02.png" alt="" width="572" height="448"></a></li>

  <li><a href="#"><img src="../../sunflimg/mainimg03.png" alt="" width="572" height="448"></a></li>

  <li><a href="#"><img src="../../sunflimg/mainimg04.png" alt="" width="572" height="448"></a></li></p>

<p> </ul>

</div>

<div style="width: 100%x; valign: top ;0 text-align:center;">

<ul class="bt-roll">

 <li><a href="#"><img src="../../sunflimg/btn_circle_.png" alt=""></a></li>

 <li><a href="#"><img src="../../sunflimg/btn_circle.png" alt=""></a></li>

 <li><a href="#"><img src="../../sunflimg/btn_circle.png" alt=""></a></li>

 <li><a href="#"><img src="../../sunflimg/btn_circle.png" alt=""></a></li>

</ul>

</div></p>

<p><script type="text/javascript">

 var $list = $('ul.mainimg');

 var size = $list.children().outerWidth();

 var len =  $list.children().length;

 var speed = 2000;

 var timer = null;

 var auto = true;

 var cnt = 1;</p>

<p> $list.css('width',len*size);</p>

<p> if(auto) timer = setInterval(autoSlide, speed);</p>

<p> $list.children().bind({

  'mouseenter': function(){

   if(!auto) return false;

   clearInterval(timer);

   auto = false;

  },

  'mouseleave': function(){

   timer = setInterval(autoSlide, speed);

   auto = true;

  }

 })</p>

<p> $('.bt-roll').children().bind({

  'click': function(){

   var idx = $('.bt-roll').children().index(this);

   cnt = idx;

   autoSlide();

   return false;

  },

  'mouseenter': function(){

   if(!auto) return false;

   clearInterval(timer);

   auto = false;

  },

  'mouseleave': function(){

   timer = setInterval(autoSlide, speed);

   auto = true;

  }

 });  </p>

<p> function autoSlide(){

  if(cnt>len-1){

   cnt = 0;

  }</p>

<p>  $list.animate({'left': -(cnt*size)+'px' },'normal');</p>

<p>  var source2 = $('.bt-roll').children().find('img').attr('src').replace('_.png','.png');

  $('.bt-roll').children().find('img').attr('src',source2);</p>

<p>  var source = $('.bt-roll').children().find('img').attr('src').replace('.png','_.png');

  $('.bt-roll').children().eq(cnt).find('img').attr('src',source);</p>

<p>  cnt++;

 }

</script>

</body>

</html></td>

            <td valign="top"></td>

          </tr>

        </table></td>

      </tr>

      <tr>

        <td><img src="sunflimg/footer.gif" width="1200" height="57" /></td>

      </tr>

    </table></td>

  </tr>

</table>

</body>

</html></p>

<p>

같은소스로 작업한 홈페이지입니다.

http://designinvent.co.kr">http://designinvent.co.kr

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

답변 2개

채택된 답변
+20 포인트
상한1
5년 전

</p>

<table>
	<tbody>
		<tr>
			<td><code><div style=</code><code>"width: 100%x; valign: top ;0 text-align:center;"</code><code>></code></td>
		</tr>
	</tbody>
</table>

<p> width: 100%x <= 오타가있는거 같습니다 </p>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code><ul </code><code>class</code><code>=</code><code>"bt-roll"</code><code>></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code> </code><code><li><a href=</code><code>"#"</code><code>><img src=</code><code>"../../sunflimg/btn_circle_.png"</code> <code>alt=</code><code>""</code><code>></a></li></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code> </code><code><li><a href=</code><code>"#"</code><code>><img src=</code><code>"../../sunflimg/btn_circle.png"</code> <code>alt=</code><code>""</code><code>></a></li></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code> </code><code><li><a href=</code><code>"#"</code><code>><img src=</code><code>"../../sunflimg/btn_circle.png"</code> <code>alt=</code><code>""</code><code>></a></li></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code> </code><code><li><a href=</code><code>"#"</code><code>><img src=</code><code>"../../sunflimg/btn_circle.png"</code> <code>alt=</code><code>""</code><code>></a></li></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code></ul></code></td>
		</tr>
	</tbody>
</table>

<table>
	<tbody>
		<tr>
			<td> </td>
			<td><code></div></code></td>
		</tr>
	</tbody>
</table>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

디자인아루즈
5년 전
수정되어 있었습니다 100%로

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

상한1
5년 전

bt-roll에 고정 width 값을주고.. margin:0 auto 로 가운데로 보내면 될거같은데..

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

디자인아루즈
5년 전
글 감사합니다 이미 해봤지만 안됩니다

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

답변을 작성하려면 로그인이 필요합니다.

로그인