2012-08-01 4 views
0

내 페이지 오른쪽에 과도한 가로 스크롤이있는 것 같습니다.전체 너비 부분 2 부

필자는 사이트 상단에있는 스크립트와 관련이 있다고 공언했습니다. 제거하면 문제가 해결됩니다.

내가 달성하기를 기대하는 바를 알려주는 것입니다. 상단의 이미지를 브라우저의 너비를 100 %로 유지하면서 유형을 중앙에 유지하려고합니다.

처음 사이트를 방문하면 내가 말하는 것에 대해 알게 될 것입니다.

<script type="text/javascript"> 
     // The social div 
    var $socialDiv, 
     // The social div's height 
     socialDivHeight = 560, 
     currentSocialDivHeight = socialDivHeight; 


    $(document).ready(function() { 
     $socialDiv = $('.social'); 
     $socialDiv.css({ 
      'background-image': 'url(http://a3.sphotos.ak.fbcdn.net/hphotos-ak-prn1/563655_324264884301748_471368753_n.jpg)', 
      'background-repeat': 'no-repeat', 
      'background-attachment': 'fixed', 
      'background-size' : '110% auto', 
      'height' : socialDivHeight + 'px', 
      'margin-left' : '-100%', 
      'margin-right' : '-100%', 


     }); 
    }); 


    $(window).scroll(function() { 
     //Get scroll position of window 
     var windowScroll = $(this).scrollTop(); 

     var newSocialDivHeight = Math.max(0, socialDivHeight - windowScroll); 

     if (Math.abs(newSocialDivHeight - currentSocialDivHeight) < 1) 
      return; 

     $socialDiv.css({ 
      'opacity' : 1 - windowScroll/400 
     }); 

     currentSocialDivHeight = newSocialDivHeight; 
    }); 
</script> 
+0

안녕하세요 이제 jsfiddle 링크를 만들고 html 코드와 css 코드를 넣어주세요. 예 : –

+0

코드를 입력 해주세요. – Vins

+0

야, jsfiddle 도움이 될 것입니다 ... 열심히 그것이 원인이 무엇인지 볼 수 있습니다. 'html, body {width : 100 %}' – neokio

답변

0

<div class="social" style="background-image: …;">가 일으키는 t을 다음과 같이 사전에

http://cargocollective.com/btatest

덕분에

마이클

편집

코드입니다 그는 스크롤바.

가로 2160 픽셀 (여백 포함)의 요소를 효과적으로 만들고 왜 가로 스크롤 막대가 있는지 궁금하십니까?

.project_content { width: 720px; } 
.social { 
    /* implied with = 100%, since this is a block element */ 
    margin-left: -100%; /* add 720px on the left */ 
    margin-right: -100%; /* add 720px on the right */ 
} 

하지만 당신의 목표는 100 %의 폭으로 .social을하는 것입니다 :

당신은있다. 이를 달성하기 위해 HTML 구조를 재주문하거나 position: relative; 또는 position: absolute;을 할당하여 "정상적인"흐름에서 요소를 가져올 수 있습니다.

+0

죄송합니다, 무슨 뜻인지 모르겠습니다. 나는 Jquery에 관해서는 noob 철자를 통해 갈거야. – Michael

+0

@ user1522319 내 대답에는 한 줄의 jQuery가 없습니다. 그냥 평범한 CSS는 당신의 문제입니다 ... – feeela

+0

내 CSS에 '.social {position : relative;}'를 추가하면 여전히 스크롤 문제가 있으며 '절대'는 '.social'을 완전히 제거합니다. – Michael