고정 비율 & 최소 너비의 캐 러셀 이미지

https://squareup.com/과 같은 회전식 컨베이어를 만들려고합니다. 이미지의 고정 비율, 최소 너비 및 최대 1400 픽셀 너비의 화면을 처리하고 싶습니다. CSS로 시도해 본 모든 것이 중단됩니다.고정 비율 & 최소 너비의 캐 러셀 이미지

CSS :

.carousel .item { 
    height: 800px; 
} 
.carousel img { 
    position: absolute; 
    top: 0; 
    left: 0; 
    min-width: 1400px; 
    height: 100%; 
}

내가 사용할 수있는 반응 플러그인 또는 이미지 슬라이더가 있습니까? 또는 CSS 트릭을 나는 비참하게 알지 못한다.

출처

2013-04-01 Akito

플러그인을 찾고있는 경우 부트 스트랩에 회전식 슬라이드가 있습니다 (http://twitter.github.com/bootstrap/javascript.html#carousel). –

저는 이미 부트 스트랩 회전 목마를 사용하고 있습니다. 문제는 그것이 내가 원하는 결과를 얻지 못하는 것입니다. 그 회전 목마가 img 비율, 최소 폭 등과 관련하여 정사각형 페이지처럼 작동하도록 할 수 없습니다. – Akito

트위터 컨베이어가 바로 사용 가능합니다. 먼저 을 max-width: 1400px;으로 변경하면 까지 1400px까지 화면을 표시 할 수 있습니다.

그러나 고정 비율을 얻지는 않습니다 (귀하의 경우에는 고정 비율이 없습니다). 이를 위해 CSS3 미디어 쿼리를 사용하여 그림의 너비와 높이를 변경할 수 있습니다.

출처

2013-04-03 12:47:54

고정 비율 & 최소 너비의 캐 러셀 이미지

답변

관련 문제