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

마우스 오버시에 텍스트 버튼느낌 style.css 와 자동 스크롤 기능

· 19년 전 · 3716
<style>
<!--
body {
scrollbar-face-color:#F0F0F0;
scrollbar-shadow-color:gray;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color:#F0F0F0;
scrollbar-darkshadow-color:#ffffff;
scrollbar-track-color:#F0F0F0;
scrollbar-arrow-color:#F0F0F0
}

a:link { color: #595959; text-decoration: none}
a:visited { color: #595959; text-decoration: none}
a:active { color: #595959; text-decoration: none}
A:hover { color: #0099FF; text-decoration:none; position:relative; top:1; left:1;}
-->
</style>
<SCRIPT LANGUAGE="javascript">
function winscroll(){
window.scroll(window.event.clientX - 30,window.event.clientY -30)
}
document.onmousemove = winscroll
</SCRIPT>

위 스타일과 스크립트는 마우스가 텍스트에 오버시에 텍스트가 왼쪽으로1픽셀 그리고 위로 1픽셀 정도 움직여서 버튼에 느낌이 들게 하는 것입니다.
제 홈에 사용한 스크롤도 같이 올립니다.

그리고 스타일 밑에 스크립트는 마우스 움직임 만으로 스크롤을 움직일수 있는 스크립트입니다.
이 소스는 제로보드 관리자 모드에서 "그룹설정" 에서 "게시판 상단에 출력할 내용" 에 그대로 복사해서
넣으시면 그 효과를 보실수 있습니다.
스크립트의 경우 보드를 인클루트사용시에는 그 효과가 나타나지 않습니다.
많은 분들이 간단한 스크립트 만으로 홈페이지를 이쁘게 꾸미실수있습니다.



http://www.nzeo.com/bbs/zboard.php?id=p_html&page=1&sn1=&divpage=1&category=2&sn=off&ss=on&sc=off&select_arrange=vote&desc=desc&no=320<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:54:41 CSS에서 이동 됨]</div>

댓글 작성

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

로그인하기

게시글 목록

번호 제목
10331
28724
10329
10328
10326
10324
10323
28723
10322
10321
10320
28722
10318
28719
10317
10314
10312
28716
10308
10307
10306
10305
28715
10304
10303
28714
10302
28713
10301
10300
10299
10296
10294
10293
10292
10291
10289
10285
28711
10281
10279
28710
10278
10277
10276
28709
10273
10270
10269
10267
28708
10266
10264
10263
10261
28707
10260
10256
10255
28706
10253
28704
10250
28703
28702
10249
10247
10245
10243
10240
10239
10238
10237
10235
10225
28700
10213
10210
10207
10205
10204
28693
10198
10195
10191
24785
28674
24784
10189
10187
10182
28669
10181
10175
24779
24772
10173
10168
10163
10160