MVC에서 Lightbox 사용하는 방법

Question

저는 Lightbox2 라이브러리를 좋아합니다. 과거 MVC 프로젝트에서는 사용하지 않았습니다. 과거에는 라이트 박스 2가 스크립트, CSS 및 이미지가있는 경로에 대해 까다로웠다는 것을 기억합니다. 특히 페이지 경로의 하위 디렉토리에 모든 내용을 넣어야합니다. 그렇지 않으면 작동하지 않습니다.

MVC가 아닌 응용 프로그램에서 접근 방식은 괜찮 았지만 이제는 MVC 응용 프로그램에서 작업하고 페이지의 URL은 디렉토리 구조와 관련이 없을 수 있습니다. 따라서 Lightbox2에 대한 지침은 다음과 같습니다.

<script type="text/javascript" src="js/prototype.js"></script> 
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> 
<script type="text/javascript" src="js/lightbox.js"></script> 

분명히 작동하지 않습니다.

나는 이미지가없는 효과를 준 자바 스크립트에 절대 경로를 두어 보았습니다. 나는 자바 스크립트가 그 이미지가 어디에 있는지를 "안다"고 의심하고 있으며 그것들을 찾을 수 없다.

Lightbox2를 MVC 환경에서 성공한 사람이 있습니까? Lightbox2를 비 - 하위 디렉토리에 배포 한 것일까 요?

감사합니다.

Answer 1

나는 라이트 박스는 다음과 같이 구조를 가지고 가정 믿는다

그리고 함께 해주십시오.

Answer 2

여기에서 우리가 말하는 MVC 프레임 워크는 무엇입니까? 당신이 알 수있는 경우

 

<script type="text/javascript" src="/js/prototype.js"> 
 

: 나는 특정 라이트 라이브러리에 익숙하지 않은거야 동안, 나는 매우 좋습니다 사이트의 루트에 절대 경로를 통해 자바 스크립트 파일을 참조하는 적절한 방법을 알아낼 것 그것이 작동하도록하는 방법을 알아 내면 이미지로 문제를 해결할 수있을 것입니다.

또한 동일한 자바 스크립트 파일을 사이트 전체에 뿌려 놓는 것은 좋지 않습니다. 분명한 혼란 문제 외에도 브라우저는 URL이 서로 다르기 때문에 동일한 파일을 캐시에서 읽는 대신 반복해서 다운로드해야합니다.

fileLoadingImage:  'images/loading.gif',  
fileBottomNavCloseImage: 'images/closelabel.gif', 

을 그리고 lightbox.css를 찾기에 :

 
/images 
    prevlabel.gif 
    nextlabel.gif 
    loading.gif 
    closelabel.gif 
/css 
    lightbox.css 
lightbox.js 

당신은 열어 lightbox.js하고 찾을 수 있습니다

#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; } 
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; } 

Answer 3

<script src="~/LightBox/js/jquery.js"></script> 

<script src="~/LightBox/js/jquery.lightbox-0.5.min.js"></script> 

<a title="Title here" class="lightbox" href="~/LightBox/images/lightbox-btn-close.gif">click</a> 



<script type="text/javascript"> 
    $(function() { 
     $('a.lightbox').lightBox();//.lightBox(); // Select all links with lightbox class 
    }); 
</script>