2011-07-26 10 views
2

나는 이와 비슷한 질문을 찾았지만 어딘가에 답을 얻었다면 사과가 필요하다는 것을 정확히 발견하지 못했습니다.REL로 HTML 5 확인하기

나는 이미지를 표시하는 내 웹 페이지에 자바 스크립트 라이트 박스를 사용하기 시작하고 링크를 배치 할 말 있어요 : <a href="..." rel="lightbox"></a>

이 의미하는 HTML 5 검사기 '라고 말한다 그러나 라이트 박스에 현재 열려있는 이미지 라이트 박스 '는 분명히 허용 된 링크 유형이 아닙니다.

라이트 박스 자바 스크립트에 필요한 링크를 연결하여 유효성을 검사하려면 어떻게해야합니까? 많이 사전에

덕분에, 매트

답변

6

어느

  1. (그들이 어떤 문제가 발생하지 않는 한) 유효성 검사 오류를 무시하거나 뭔가 rel="lightbox"에서

  2. 변경 등 data-lightbox="true". "data-"로 시작하는 속성은 HTML5에서 허용되고 유효합니다.

+0

후자. 'rel = "lightbox"'는 쓰레기입니다. – Quentin

+0

답장을 보내 주셔서 감사합니다. 나는'data-lightbox' 메소드를 구현하려고 시도했으나 곧바로 작동하지 않았다. 그래서 내가 할 때까지 그것을 수정해야하고,'data' 태그에 대해 더 많이 읽어야한다. 다른 말로는 쓰레기이다. 그래서 그것을 사용하지 않는 것이 가장 좋을 것입니다! – matt

+0

xhtml1을 사용 중이며 rel = "lightbox"로 다시 전환되었습니다. 다른 하나는 나에게 오류를 준다. – onurcano22

0

매튜의 대답은 작동하지만 라이트 박스 소스 코드도 사용자 정의해야합니다. 이러한 수정의 예는 http://wasthere.com/lightbox2/js/custom-lightbox.js - 작동합니다 (예 : http://wasthere.com/asia/en/show-entry/141/kerala---munnar-(india). HTML5 유효성 검사가 통과합니다. 위의 소스 파일에서 주석을 확인하십시오 (사용하려는 경우) - 라이트 박스 이미지와 관련된 모든 "rel"속성을 사이트의 "data-rel"로 변경하십시오.

안부, 루카스

-1

시 싸다 solucione :

Modifico 엘 HTML :

<a href="img/2.jpg" data-rel="lightbox" title="" > 

Modifico 엘 자바 스크립트 : 내가 그것을 확인하는 도움이 무엇

jQuery(function($) { 
     $("a[data-rel^='lightbox']").slimbox({/* Put custom options here */}, null, function(el) { 
      return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel)); 
     }); 
    }); 
} 
0

, 위에 명시된 내용을 기반으로합니다 :

자바 스크립트

function externalLinks() 
{ 
    if (!document.getElementsByTagName) return; 
    var anchors = document.getElementsByTagName("a"); 

    for (var i=0; i<anchors.length; i++) 
    { 
     var anchor = anchors[i]; 

     if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external") 
     { 
      anchor.target = "_blank"; 
     } 

     if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "lightbox") 
     { 
      anchor.setAttribute('data-lightbox','lightbox'); 
     } 
    } 
} 
window.onload = externalLinks; 

HTML :

<a href='assets/newsTemplate/07_350wtd.jpg' rel='lightbox' title='DumbThumb'><img src='assets/newsTemplate/07_350wtd.jpg' alt='dumb'></img></a> 
바람직