2013-09-27 3 views
1

나는 fotorama의 슬라이드 쇼를 엄지와 통합했습니다. 나는이 플러그인을 사랑하지만,이 경우, 구문은 다음는 큰 이미지를 표시하는 데 사용됩니다Fotorama jquery - 슬라이드의 외부 페이지에 대한 링크 추가

<div class="fotorama" 
data-nav="thumbs"> 
<a href="1.jpg"><img src="1_thumb.jpg"></a> 
(...) 

, 그래서 외부 페이지에 링크를 추가 할 수 없습니다.

나는 이것을 쓸 수 없다 !! :

누군가 해결책이 있습니까? 사전

답변

4

사용 HTML technique에서

덕분에 프레임을 통해 투명 링크를 추가합니다 :

<div class="fotorama"> 
    <div data-img="1.jpg"><a href="http://google.com/"></a></div> 
    <div data-img="2.jpg"><a href="http://apple.com/"></a></div> 
</div> 

스트레치 링크를 CSS로 :

.fotorama__html div, 
.fotorama__html a { 
    display: block; 
    height: 100%; 
    /* Transparent links are not clickable in IE, 
    but non-existent background fixes this. 
    (Put an empty 1×1 image here to avoid 
    errors in console.) */ 
    background: url(_.gif); 
} 

바이올린 : http://jsfiddle.net/artpolikarpov/gzQwy/합니다.

+0

그러나 $ ('.fotorama') .fotorama()를 적용한 후 fotorama 코드를 빌드하면 "내부"링크를 클릭 할 수 없습니다. – RAY

-1

나는 위의 제안을 사용하여 Chrome (버전 35.0.1916.153 m)에서 문제를 발견했습니다. 외부 링크는 간헐적으로 만 작동했습니다. 그래서 솔루션을 주변 탐색 및 수정 발견

고토에 chrome : // 플래그를/그리고 다음을 사용 :

고정 위치 요소는 스택 문맥을 생성합니다. Mac, Windows, Linux, Chrome OS, Android 이 옵션을 사용하면 모든 고정 위치 요소가 새로운 CSS 스태킹 컨텍스트를 만듭니다. # 고정 위치 - 생성 - 컨텍스트를 적층 고정 위치 요소

AND

합성한다. Mac, Windows, Linux, Chrome OS, Android 이 옵션을 사용하면 고정 된 위치 요소가 고유 한 합성 레이어를 갖게됩니다. 고정 된 위치 요소는이 작업을 수행하기 위해 스태킹 컨텍스트를 만들어야합니다. # enable-compositing-for-fixed-position.

희망 사항은이 정보가 도움이되기를 바랍니다.

관련 문제