2014-12-05 4 views
0

저는 bxslider를 사용하고 있으며 현재 슬라이드를 확대/축소 효과로 만들고 싶습니다.확대/축소 효과가있는 jquery 활성 (가운데) 슬라이드

샘플 이미지 URL : http://i.imgur.com/bU9I4yT.jpg?1

Bxslider 샘플 예제 : http://bxslider.com/examples/carousel-demystified#example4

나는 몇 줌 플러그인 보았다,하지만 그들 중 누구도이 특정한 영향을주지 않습니다.

아무도 도와 줄 수 있습니까?

예 :

(이전) image1에 이미지 2 이미지 3 (다음)

내가 다음을 클릭합니다. 그것은이

(이전) 이미지 3 IMAGE2 이미지 4 (NEXT)

이미지 3 인 것처럼 보여 현재 확대 된 표시 효과 않도록 이미지 3 활성화.

+0

요소에 대한 동작 (이전/현재/다음) 줌은 슬라이더가 슬라이딩하는 동안 예상합니까? 이것은 너무 광범위합니다. –

+0

당신의 코드와 당신의 노력을 보여주세요. 어쩌면 우리는 당신을 돕기 위해 노력할 것입니다. – Naruto

답변

0

다음 스타일링이 효과적입니다. 활성 이미지 div에 "활성"클래스를 추가하십시오. 또한 이러한 스타일은 JavaScript에 의해 추가되므로 코드에서 수정하거나 다음 스타일을 !important으로 표시해야합니다.

.bx-viewport { 
height: 170px; 
padding-top: 10px; 
} 

.slide { 
margin-right: 5px; 
} 

.slide.active { 
width: 360px; 
margin-right: 5px; 
margin-top: -10px; 
} 

.slide.active img { 
width: 360px; 
} 

희망 사항.

관련 문제