슬라이드 메뉴바 스크롤따라 움직이게 도움

환이

· 15년 전 · 조회 1757 1757 · 댓글 1 1

http://sir.co.kr/bbs/tb.php/g4_skin/111843/01a46b6912a0d9728993c88a3e05b983

하단에 첨부한 코딩으로 조합하려 했으나 실패했습니다 도와주세효

<title>script.aculo.us sidebar</title>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/effects.js"></script>
<script type="text/javascript" src="js/side-bar.js"></script>

<style>

/****************************************/

a{
outline: none;
}

a:active{
outline: none;
}

#sideBar{
text-align:left;
}

#sideBar h2{
color:#FFFFFF;
font-size:110%;
font-family:arial;
margin:10px 10px 10px 10px;
font-weight:bold !important;
}

#sideBar h2 span{
font-size:125%;
font-weight:normal !important;
}

#sideBar ul{
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
}

#sideBar li{
margin:0px 10px 3px 10px;
padding:2px;
list-style-type:none;
display:block;
background-color:#DA1074;
width:177px;
color:#FFFFFF;
}

#sideBar li a{
width:100%;
}

#sideBar li a:link,
#sideBar li a:visited{
color:#FFFFFF;
font-family:verdana;
font-size:100%;
text-decoration:none;
display:block;
margin:0px 0px 0px 0px;
padding:0px;
width:100%;
}

#sideBar li a:hover{
color:#FFFFFF;
text-decoration:underline;
}

#sideBar{
position: absolute;
width: auto;
height: auto;
top: 140px;
right:0px;
background-image:url(images/background.gif);
background-position:top left;
background-repeat:repeat-y;
}

#sideBarTab{
float:left;
height:137px;
width:28px;
}

#sideBarTab img{
border:0px solid #FFFFFF;
}

#sideBarContents{
float:left;
overflow:hidden !important;
width:200px;
height:320px;
}

#sideBarContentsInner{
width:200px;
}

</style>

</head>

<body>

<div id="sideBar">

<a href="#" id="sideBarTab"><img src="images/slide-button.gif" alt="sideBar" title="sideBar" /></a>

<div id="sideBarContents" style="display:none;">
<div id="sideBarContentsInner">
<h2>side<span>bar</span></h2>

<ul>
<li><a href="#">Link One</a></li>
<li><a href="#">Link Two</a></li>
<li><a href="#">Link Three</a></li>
<li><a href="#">Link Four</a></li>
<li><a href="#">Link Five</a></li>
</ul>

</div>
</div>
</div>
</body>
</html>

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

<style type="text/css">
body{
background:url(foo) fixed;
}
div#aside{
position:fixed;
left: 860px;
top: 20px;
_position:expression('absolute');
_left: expression(offsetParent.scrollLeft+860+'px');
_top: expression(offsetParent.scrollTop+20+'px');
}
</style>

<div id="aside">레이어</div>

<? for ($i = 0; $i < 100; $i++) { ?>
<p><?=$i?></p>
<? } ?>

댓글 작성

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

로그인하기

댓글 1개

l2zeo

프로필 보기 이 회원 글보기

15년 전

스크롤바따라 움직이게는 보니깐 자바스크립트에서 충돌이 나는거 같더라구요.

고정을 시키시는게 어떨까 합니다. 효과는 똑같이 사이드바에 따라 움직이는거처럼 보이겠죠.

게시글 목록

번호	제목	글쓴이	조회	날짜
284348	이런형식 가능할까요? 2	너와나는	2,126	11년 전
284336	홈페이지작업중 글씨깨짐 3	연금술샤	4,474	11년 전
284333	홈페이지 공지사항 목록들의 글자색이 도저히 변경될 생각을 안해요..ㅜ.ㅜ 검정색.. 2	아미꼬	4,137	11년 전
284332	특정회원만 로딩속도가... 1	루로우니	2,407	11년 전
284320	로그인 안된상태에서 게시판에 접속시, 로긴페이지로 넘어가는데.. 1	토리군	3,021	11년 전
284318	게시판 목록에서 코멘트 아이디를 출력할 수 있을까요?? 3	반갑습니다요	2,885	11년 전
284316	글쓰기 기본내용 추가하여 선택호출하고싶습니다 1	불편한진실	3,472	11년 전
284313	회원가입 시 이용약관동의와 회원정보입력 페이지 통합 2	자동차방향제	2,924	11년 전
284307	최근게시물에 노출 되는 순서를 반대로 할 수도 있나요? 3	구라대마왕	2,701	11년 전
284306	css3 관련 질문입니다... 6	춘자지훈	2,776	11년 전
284303	sns 식 종료날짜 표기방법 2	히어1	3,104	11년 전
284298	그누보드4 배추빌더 게시판 사용시... 5	착한아이민이	3,294	11년 전
284296	와우 파일이 어디 있는지 모르겠네요 1	붉은피쉬	2,706	11년 전
284290	로그인폼에서 아이디 칸에 아이디 / 패스워드 칸에 패스워드라고 미리 보여지는 텍스트 수정에 대해서... 2	착한아이민이	2,560	11년 전
284286	반응형 웹에서 메뉴 문의 3	canth	3,287	11년 전
284280	엄청난 스팸성 글때문에 미치겠습니다.... 5	한번잘해보자	4,222	11년 전
284277	각 게시물 최근댓글 제목옆에 호출하기 질문이요 3	투비유	2,856	11년 전
284272	정말 간단한 정규식하나 부탁드립니다 1	xargs	2,543	11년 전
284261	네임 문의 2	aisru	2,628	11년 전
284259	stx가 중복되어 나오고 마직막 나온것만... 2	alexseo	2,727	11년 전

이전 다음

1 2 3 4 5

전체 목록