지역 사회 배우다 도구 라이브러리 여가

한국어

집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

jquery picswitch 그림 포커스 맵 표시 effect_jquery

WBOY

풀어 주다： 2016-05-16 18:26:35

원래의

1303명이 탐색했습니다.

효과는 다음과 같습니다. jquery picswitch 그림 포커스 맵 표시 effect_jquery
이 플러그인의 핵심은 JQuery-1.4.2.js 출시와 함께 추가된 새로운 함수 데이터를 적용한 것이므로 jquery 라이브러리는 1.4 버전이어야 합니다. 2

반면에 CSS 작성에서는 setInterval과 setTimeout을 사용하는 경우 전자는 매번 실행되고 후자는 매번 실행됩니다.

두 가지 형태가 있습니다. setTimeout 사용법 1 setTimeout( code,interval의 코드)은 문자열

2입니다. setTimeout(func,interval,args)의 func는

구현 코드

jquery 슬라이드픽트루<title>
</title>
<style type="text/css"> 
*{ margin:0px; padding:0px; list-style:none; } 
body{ font-size:12px; color:white} 
#imageShow { position:relative;z-index:3;overflow:hidden;width:586px;height:150px } 
#imageShow #imageSwitch { position:absolute;right:0px;bottom:0px;padding-left:50px;z-index:4; 
background-color:#C08A93;filter:Alpha(opacity=70); opacity:0.7;} 
#imageShow #imageSwitch li{ float:left;border-left:1px solid white;height:14px;width:30px; 
text-align:center;line-height:14px;} 
</style>

<div id="imageShow">
<ul id="imageSrc">
<li>
<img  src="http://files.jb51.net/demoimg/201005/o_1.gif" alt="jquery picswitch 그림 포커스 맵 표시 effect_jquery" >
</li>
<li>
<img  src="http://files.jb51.net/demoimg/201005/o_2.gif" alt="jquery picswitch 그림 포커스 맵 표시 effect_jquery" >
</li>
<li>
<img  src="http://files.jb51.net/demoimg/201005/o_3.gif" alt="jquery picswitch 그림 포커스 맵 표시 effect_jquery" >
</li>
<li>
<img  src="http://files.jb51.net/demoimg/201005/o_4.gif" alt="jquery picswitch 그림 포커스 맵 표시 effect_jquery" >
</li>
<li>
<img  src="http://files.jb51.net/demoimg/201005/o_5.gif" alt="jquery picswitch 그림 포커스 맵 표시 effect_jquery" >
</li>
</ul>
<ul id="imageSwitch">
<li>
</li>1<li>
</li>2<li>
</li>3<li>
</li>4<li>
</li>5</ul>
</div>

[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다

]

관련 라벨：

jquery 焦点图

원천：php.cn

이전 기사：JavaScript 작업 XML 예제 코드(뉴스 제목 가져오기 및 페이지 매기기, 페이지 매기기)_javascript 기술 다음 기사：JQuery text box_jquery 사용 요약

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

저자별 최신 기사

NullPointerException은 무엇이며 어떻게 해결합니까?

2024-10-22 09:46:29
초보자에서 코더까지: C 기초로 시작되는 여정

2024-10-13 13:53:41
PHP로 웹 개발 잠금 해제: 초보자 가이드

2024-10-12 12:15:51
C에 대한 이해: 새로운 프로그래머를 위한 명확하고 간단한 길

2024-10-11 22:47:31
코딩 잠재력 발휘: 완전 초보자를 위한 C 프로그래밍

2024-10-11 19:36:51
내면의 프로그래머를 깨워보세요: 완전 초보자를 위한 C

2024-10-11 15:50:41
C로 일상을 자동화하세요: 초보자를 위한 스크립트 및 도구

2024-10-11 15:07:41
PHP가 쉬워졌습니다: 웹 개발의 첫 번째 단계

2024-10-11 14:21:21
Python으로 무엇이든 빌드하기: 창의력을 발휘하기 위한 초보자 가이드

2024-10-11 12:59:11
코딩의 핵심: 초보자를 위한 Python의 힘 활용

2024-10-11 12:17:31

최신 이슈

Javascript/Jquery를 사용하여 버튼 없이 양식 제출 JavaScript 함수를 호출하고 JQUERY/PHP를 사용하여 양식을 실행하여 버튼 없이 양식을 제출하려고 합니다. 페이지를 다시 로드하지 않고 백엔드에서 양...

에서 2024-04-06 14:54:03

0

2

421

jquery를 사용하여 HTML 데이터 테이블에서 선택되지 않은 행의 값을 검색하는 방법 버튼을 클릭하지 않은 모든 행의 값을 얻으려고합니다. 예를 들어, 첫 번째 행의 버튼을 클릭했을 때 클릭되지 않은 행의 값을 검색하고 싶습니다. vartable=...

에서 2024-04-05 09:26:49

0

1

1418

최종 사용자의 현재 선택에 따라 선택 상자에서 선택한 옵션을 이동하려면 jquery 스크립트가 필요합니다. 최종 사용자가 선택 상자 요소를 통해 항목의 순위를 지정할 수 있는 HTML 페이지가 있습니다. 간단한 데모를 보려면 바이올린을 참조하세요: https://jsf...

에서 2024-04-04 18:40:04

0

1

3528

북마크를 통해 순수 CSS로 요소를 만들었습니다. 생성되었으나 표시되지 않음 내 코드는 다음과 같습니다: g=document.createElement('div');g.setAttribute("id","divcon...

에서 2024-04-04 17:27:27

0

1

417

Safari/Firefox iOS에서 양식 데이터를 보낼 수 없습니다. 이는 iOS의 Safari/Firefox를 제외한 모든 플랫폼에서 작동합니다: jQuery("#gform_1").one('submit',func...

에서 2024-04-04 12:53:48

0

1

303

관련 주제

더>

인기 추천

인기 튜토리얼

더>

관련 튜토리얼

인기 추천

최신 강좌

최신 다운로드

더>

웹 효과

웹사이트 소스 코드

웹사이트 자료

프론트엔드 템플릿