jQuery 플로팅 광고 구현 code_jquery-JS 튜토리얼-php.cn

jQuery 플로팅 광고 구현 code_jquery

WBOY

풀어 주다： 2016-05-16 18:56:59

원래의

1330명이 탐색했습니다.

구현 방법:

코드 복사 코드는 다음과 같습니다.

플로팅 광고
jquery- 1.2.6.js" type="text/javascript">

QQ 온라인 서비스
< /div>

QQfsdf 온라인 서비스

🎜>

jquery 기반 플로팅 광고 제어 코드

최근 jquery를 접하고 조금 배워서 사장님의 요구사항을 충족시키기 위해 만들었습니다. 화면에 대해 정적인 플로팅 레이어입니다. 나중에 사용해야 할 경우를 대비해 여기에 코드를 기록했습니다.

실행하려면 jquery 클래스 라이브러리의 지원이 필요한 jquery 코드입니다. 글을 작성했는데 jquery 버전이 1.3.2 였는데, 다른 버전에서도 완벽하게 실행된다는 보장은 없습니다. javascript와 jquery에 대한 지식은 많지 않습니다. 왜냐하면 이 글을 쓸 당시에는 아는 것이 별로 없었기 때문입니다....

$(document).ready(function(){
$ (window). scroll( function() { //이 함수는 브라우저 스크롤 막대를 모니터링할 수 있습니다. 스크롤 막대가 이동하자마자 이 함수가 트리거됩니다.
var diffY = $(window).scrollTop(); //페이지가 이제 표시됩니다. 위치와 스크롤 막대 상단 사이의 거리 [scrollTop()]

var diffH = $(window).height()/4;//플로팅 막대와 브라우저 상단 사이의 거리 디자이너 [height()], 이는 브라우저 상단에서 페이지 높이를 1/4로 유지하기 위한 것입니다. diffH 값을 0으로 설정하면 플로팅 바가 화면 상단으로 떨어집니다. 🎜>var rates=diffY diffH; //%는 부동 막대의 새 높이 값으로 CSS "top" 속성에 할당됩니다.
if(percent<0){ //% 값이 다음과 같은지 여부를 판단합니다. 0보다 작으면 반올림하고, 0보다 크면 소수점은 무시합니다percent=Math .ceil(percent)
}else{
percent=Math.floor( 퍼센트); //반올림var v = 퍼센트 "px"; //CSS 속성에는 단위가 필요합니다. 여기서는 px입니다.
$("#adright").css("top",v);// %는 top 속성에 할당되며 브라우저는 이 값을 기반으로 플로팅 바의 높이를 동적으로 조정합니다. 위에 제공된 코드를 따르면 이 높이는 플로팅 바를 화면 중앙에 유지합니다
}
})

/////////////////////////////////// //////// JS와 HTML 사이의 구분선 //////////////////////// //////////// ////////////////////////////////////

다음은 HTML 코드입니다 .. 이 부분을 HTML 페이지에 넣으면 됩니다. php, jsp, asp 등과 같은 동적 페이지는 괜찮을 것입니다... 사진을 넣으려면 위의 , 텍스트 및 플래시를

XXXX

의 XXXX 위치에 배치하려면 right:25px를 left:25px로 변경하세요.

script 홈< /a>