2012-07-18 3 views
-1

나는이 JQuery 이미지 프리젠 테이션을 가지고 있으며 어떤 이유로 이미지에서 작업 할 앵커 태그를 얻을 수 없다. 이 내 페이지입니다 : http://orhsfoundation.com/Trial이미지가 링크가 아닌 이유는 무엇입니까?

이 필요한 경우 나도 몰라하지만 여기 당신은 간다

HTML :

<div id="allinone_bannerWithPlaylist_easy" style="; ; display: none;background-color: #03F;"> 
      <!-- IMAGES --> 
     <a href="about.html"><img src="Assets/Images/01_easyPlaylist.jpg" alt="" data-title="Lorem Ipsum Dolor1" data-text-id="#allinone_bannerWithPlaylist_photoText1" data-desc="Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque hendrerit " border="0" /></a> 


      <img src="Assets/Images/02_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText2" data-title="Fusce Suscipit Risus2" data-desc="Phasellus vitae velit eu turpis consequat hendrerit. Curabitur vitae sapien libero, amet ornare lectus." /> 
      <img src="Assets/Images/03_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText3" data-title="Class Aptent Taciti " data-desc="Maecenas interdum interdum enim id laoreet. Curabitur semper fermentum leo pretium eleifend." /> 
      <img src="Assets/Images/04_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText4" data-title="Maecenas Lacus Ante" data-desc="Donec hendrerit magna sit amet eros lobortis non egestas diam scelerisque. Praesent molestie aliquet ipsum." /> 
      <img src="Assets/Images/05_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText5" data-title="Lorem Ipsum Dolor" data-desc="Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque hendrerit" /> 
      <img src="Assets/Images/06_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText6" data-title="Suscipit Risus" data-desc="Phasellus vitae velit eu turpis consequat hendrerit. Curabitur vitae sapien libero, amet ornare lectus." /> 



      <img src="Assets/Images/01_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText1" data-title="Lorem Ipsum Dolor1" data-desc="Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque hendrerit " /> 
      <img src="Assets/Images/02_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText2" data-title="Fusce Suscipit Risus2" data-desc="Phasellus vitae velit eu turpis consequat hendrerit. Curabitur vitae sapien libero, amet ornare lectus." /> 
      <img src="Assets/Images/03_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText3" data-title="Class Aptent Taciti " data-desc="Maecenas interdum interdum enim id laoreet. Curabitur semper fermentum leo pretium eleifend." /> 
      <img src="Assets/Images/04_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText4" data-title="Maecenas Lacus Ante" data-desc="Donec hendrerit magna sit amet eros lobortis non egestas diam scelerisque. Praesent molestie aliquet ipsum." /> 
      <img src="Assets/Images/05_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText5" data-title="Lorem Ipsum Dolor" data-desc="Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque hendrerit" /> 
      <img src="Assets/Images/06_easyPlaylist.jpg" alt="" data-text-id="#allinone_bannerWithPlaylist_photoText6" data-title="Suscipit Risus" data-desc="Phasellus vitae velit eu turpis consequat hendrerit. Curabitur vitae sapien libero, amet ornare lectus." />         



      <!-- TEXTS --> 
      <div id="allinone_bannerWithPlaylist_photoText1" class="allinone_bannerWithPlaylist_texts"> 
       <div class="allinone_bannerWithPlaylist_text_line textbg_easy" data-initial-left="0" data-initial-top="100" data-final-left="-50" data-final-top="320" data-duration="0.5" data-fade-start="0" data-delay="0"> 
       <div class="textElement11_easy">Up to 5 types of banners</div> 
       <div class="textElement12_easy">Each with multiple SKINS</div></div> 
      </div> 

      <div id="allinone_bannerWithPlaylist_photoText2" class="allinone_bannerWithPlaylist_texts"> 
       <div class="allinone_bannerWithPlaylist_text_line textElement21_easy" data-initial-left="80" data-initial-top="50" data-final-left="30" data-final-top="30" data-duration="0.5" data-fade-start="0" data-delay="0">16 transition effects for images</div> 
       <div class="allinone_bannerWithPlaylist_text_line textElement22_easy" data-initial-left="280" data-initial-top="80" data-final-left="30" data-final-top="90" data-duration="0.5" data-fade-start="0" data-delay="0.3">optional can set the transition for each image</div> 
      </div> 


      <div id="allinone_bannerWithPlaylist_photoText3" class="allinone_bannerWithPlaylist_texts"> 
       <div class="allinone_bannerWithPlaylist_text_line textElement31_easy" data-initial-left="0" data-initial-top="50" data-final-left="40" data-final-top="35" data-duration="0.5" data-fade-start="0" data-delay="0">Animated text from any direction</div> 
       <div class="allinone_bannerWithPlaylist_text_line textElement32_easy" data-initial-left="0" data-initial-top="90" data-final-left="40" data-final-top="66" data-duration="0.5" data-fade-start="0" data-delay="0.3">top, bottom, left and right</div> 
       <div class="allinone_bannerWithPlaylist_text_line textElement33_easy" data-initial-left="0" data-initial-top="200" data-final-left="40" data-final-top="101" data-duration="1" data-fade-start="0" data-delay="0.5">Any color, CSS and HTML formated</div>    
      </div> 


      <div id="allinone_bannerWithPlaylist_photoText4" class="allinone_bannerWithPlaylist_texts"> 
       <div class="allinone_bannerWithPlaylist_text_line textbg_easy" data-initial-left="0" data-initial-top="100" data-final-left="0" data-final-top="287" data-duration="0.5" data-fade-start="0" data-delay="0"> 
       <div class="textElement41_easy">Lorem <a href="http://codecanyon.net/user/LambertGroup" target="_blank">Ipsum</a> Dolor Sit Amet</div> 
       <div class="textElement42_easy">Consectetur Adiscipit</div></div> 
      </div> 

      <div id="allinone_bannerWithPlaylist_photoText5" class="allinone_bannerWithPlaylist_texts"> 
       <div class="allinone_bannerWithPlaylist_text_line textElement51_easy" data-initial-left="30" data-initial-top="0" data-final-left="30" data-final-top="270" data-duration="0.5" data-fade-start="0" data-delay="0">Line One is here</div> 
       <div class="allinone_bannerWithPlaylist_text_line textElement52_easy" data-initial-left="30" data-initial-top="384" data-final-left="30" data-final-top="250" data-duration="0.5" data-fade-start="0" data-delay="0.3">Line Two over there</div> 
      </div> 

CSS (일부는 밖으로 편집과) :

.allinone_bannerWithPlaylistBorder { 
    position:relative; 
} 


/* the container */ 
.allinone_bannerWithPlaylist { 
    position:relative; 


} 
.allinone_bannerWithPlaylist img { 
    position:absolute; 
    top:0px; 
    left:0px; 
    max-width:100%; 
    max-height:100%;  
} 
.allinone_bannerWithPlaylist .stripe { 
    position:absolute; 
    display:block; 
    height:100%; 
    z-index:1; 
} 
.allinone_bannerWithPlaylist .block { 
    position:absolute; 
    display:block; 
    z-index:1; 
     } 


/***ELEGANT SKIN***/ 

.allinone_bannerWithPlaylist.elegant .bannerControls { 
    position:absolute; 
    left:0; 
    top:0; 
    z-index:2; 
} 

.allinone_bannerWithPlaylist.elegant .leftNav { 
    position:absolute; 
    left:0px; 
    top:50%; 
    margin-top:-35px; /* height/2 */ 
    width:31px; 
    height:71px; 
    background:url(leftNavOFF.png) 0 0 no-repeat; 
    cursor: pointer; 
} 

.allinone_bannerWithPlaylist.elegant .leftNav:hover { 
    background:url(leftNavON.png) 0 0 no-repeat; 
} 
.allinone_bannerWithPlaylist.elegant .rightNav { 
    position:absolute; 
    right:0px; 
    top:50%; 
    margin-top:-35px; /* height/2 */ 
    width:31px; 
    height:71px; 
    background:url(rightNavOFF.png) 0 0 no-repeat; 
    cursor: pointer; 
} 
.allinone_bannerWithPlaylist.elegant .rightNav:hover { 
    background:url(rightNavON.png) 0 0 no-repeat; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolderWrapper { 
    position:absolute; 
    background:#e9e9e9; 
    /*height:121px; 
    width:100%;*/ 
    height:100%; 
    overflow:hidden; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolderVisibleWrapper { 
    position:absolute; 
    /*width:100%; 
    height:121px;*/ 
    height:100%; 
    overflow:hidden; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder { 
    position:absolute; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbOFF { 
    display:block; 
    height:110px; 
    background:#cfcfcf; 
    text-align:left; 
    line-height:1.4em; 
    cursor: pointer; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbOFF .padding { 
    padding:10px; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbOFF .title { 
    font: bold 13px 'Droid Sans', sans-serif; 
    color:#000; 
    display:inline-block; 
    padding-bottom:5px; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbOFF .reg { 
    font: 11px Arial, sans-serif; 
    color:#000; 
    line-height:1.4em; 
} 

.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbOFF img { 
    position:relative; 
    float:left; 
    margin-right:10px; 
} 

.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbON { 
    background:#611731; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbON .title { 
    color:#ff771c; 
} 
.allinone_bannerWithPlaylist.elegant .thumbsHolder_ThumbON .reg { 
    color:#FFF; 
} 


/* scroller start */ 
.allinone_bannerWithPlaylist.elegant .slider-vertical { 
    display:none; 
    position:absolute; 
    width:6px; 
} 

.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider { position: relative;} 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 6px; height: 25px; cursor: pointer; background:url(scrollerFaceOFF.png) 0 0 no-repeat; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider .ui-slider-handle:hover { background:url(scrollerFaceON.png) 0 0 no-repeat; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider .ui-slider-range { position: absolute; z-index: 1; display: block; border: 0; } 


.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider-vertical { width: 6px; height: 100px; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider-vertical .ui-slider-handle { left: 0px; margin-left: 0px; margin-bottom: -25px;; border: 0; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider-vertical .ui-slider-range-min { bottom: 0; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-slider-vertical .ui-slider-range-max { top: 0; } 


/* Component containers 
----------------------------------*/ 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-widget-content { xbackground: #FF0000; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical .ui-widget-header { xbackground: #0000cc; } 


/* Corner radius */ 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-corner-all {} 

/* Interaction states 
---------------------------------- 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-state-default {background: #000000; } 
.allinone_bannerWithPlaylist.elegant .slider-vertical.ui-state-hover { background: #FFF000; } 
*/ 
/* scroller end */ 




/***EASY SKIN***/ 

.allinone_bannerWithPlaylist.easy .bannerControls { 
    position:absolute; 
    left:0; 
    top:0; 
    z-index:2; 
} 

.allinone_bannerWithPlaylist.easy .leftNav { 
    position:absolute; 
    left:5px; 
    top:50%; 
    margin-top:-35px; /* height/2 */ 
    width:41px; 
    height:41px; 
    background:url(Assets/Images/Banner/skins/easy/leftNavOFF.png) 0 0 no-repeat; 
    cursor: pointer; 

} 

.allinone_bannerWithPlaylist.easy .leftNav:hover { 
    background:url(Assets/Images/Banner/skins/easy/leftNavON.png) 0 0 no-repeat; 
} 
.allinone_bannerWithPlaylist.easy .rightNav { 
    position:absolute; 
    right:5px; 
    top:50%; 
    margin-top:-35px; /* height/2 */ 
    width:41px; 
    height:41px; 
    background:url(Assets/Images/Banner/skins/easy/rightNavOFF.png) 0 0 no-repeat; 
    cursor: pointer; 
} 
.allinone_bannerWithPlaylist.easy .rightNav:hover { 
    background:url(Assets/Images/Banner/skins/easy/rightNavON.png) 0 0 no-repeat; 
} 


.allinone_bannerWithPlaylist.easy .thumbsHolderWrapper { 
    position:absolute; 
    background:#e9e9e9; 
    height:100%; 
    overflow:hidden; 
    width:100%; 
} 

.allinone_bannerWithPlaylist.easy .thumbsHolderVisibleWrapper { 
    position:absolute; 
    height:100%; 
    overflow:hidden; 

} 

.allinone_bannerWithPlaylist.easy .thumbsHolder { 
    position:absolute; 

} 

.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbOFF { 
    display:block; 
    height:96px; 
    background:url(Assets/Images/Banner/skins/easy/bgPlaylistUnit.png) top left repeat-x; 
    text-align:left; 
    line-height:1.4em; 
    cursor: pointer; 
} 
.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbOFF .padding { 
    padding:10px; 
} 
.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbOFF .title { 
    font: bold 13px 'Droid Sans', sans-serif; 
    color:#000; 
    display:inline-block; 
    padding-bottom:5px; 
} 
.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbOFF .reg { 
    font: 11px Arial, sans-serif; 
    color:#000; 
    line-height:1.4em; 
} 
/**** 
.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbOFF img { 
    position:relative; 
    float:left; 
    margin-right:10px; 
}/****/ 

.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbON { 
    /*background: #611731 url(skins/easy/thumbActiveArrow.png) -3px 0px no-repeat;*/ 
    background: #611731; 
    z-index:4; 
} 

.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbON .title { 
    color:#ff771c; 
} 
.allinone_bannerWithPlaylist.easy .thumbsHolder_ThumbON .reg { 
    color:#FFF; 
} 


/* scroller start */ 
.allinone_bannerWithPlaylist.easy .slider-vertical { 
    display:none; 
    position:absolute; 
    width:6px; 
} 

.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider { position: relative;} 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 6px; height: 25px; cursor: pointer; background:url(Assets/Images/Banner/skins/easy/scrollerFaceOFF.png) 0 0 no-repeat; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider .ui-slider-handle:hover { background:url(Assets/Images/Banner/skins/easy/scrollerFaceON.png) 0 0 no-repeat; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider .ui-slider-range { position: absolute; z-index: 1; display: block; border: 0; } 


.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider-vertical { width: 6px; height: 100px; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider-vertical .ui-slider-handle { left: 0px; margin-left: 0px; margin-bottom: -25px;; border: 0; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider-vertical .ui-slider-range-min { bottom: 0; } 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-slider-vertical .ui-slider-range-max { top: 0; } 


/* Component containers 
----------------------------------*/ 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-widget-content { xbackground: #FF0000; } 
.allinone_bannerWithPlaylist.easy .slider-vertical .ui-widget-header { xbackground: #0000cc; } 


/* Corner radius */ 
.allinone_bannerWithPlaylist.easy .slider-vertical.ui-corner-all {} 


/***EASY TEXTS***/ 

.textbg_easy { 
    width:690px; 
    background:url(Assets/Images/Banner/skins/easy/textBg_transparency.png); 
    padding:5px 10px 5px 10px; 

} 

.textElement11_easy { 
    font: bold 24px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:0px 10px 3px 10px; 
    color:#ffffff; 
} 
.textElement12_easy { 
    font: bold 18px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:0px 10px 3px 10px; 
    color:#ffffff; 
} 


.textElement21_easy { 
    width:265px; 
    background:#512d5d; 
    font: bold 22px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:5px 10px 5px 10px; 
    color:#ffffff; 
} 
.textElement22_easy { 
    width:240px; 
    background:#611731; 
    font: bold 14px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    padding:7px 10px 7px 10px; 
    color:#ffffff; 
} 


.textElement31_easy { 
    background:#d61d1d; 
    font: bold 18px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:5px 10px 5px 10px; 
    color:#ffffff; 
} 
.textElement32_easy { 
    background:#ffffff; 
    font: bold 18px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    padding:7px 10px 7px 10px; 
    color:#000000; 
} 

.textElement33_easy { 
    background:#000000; 
    font: bold 18px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    padding:7px 10px 7px 10px; 
    color:#ffffff; 
} 

.textElement41_easy { 
    font: bold 24px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:0px 10px 3px 10px; 
    color:#ffffff; 
} 


.textElement41_easy a { 
    text-decoration:none; 
    color:#ff771c; 
} 

.textElement41_easy a:hover { 
    color:#c1dd56; 
} 

.textElement42_easy { 
    font: bold 18px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:0px 10px 3px 10px; 
    color:#ffffff; 
} 


.textElement51_easy { 
    font: bold 38px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:6px 15px 6px 15px; 
    color:#000000; 
} 
.textElement52_easy { 
    font: bold 20px 'Droid Sans', Verdana, Helvetica, sans-serif; 
    text-transform:uppercase; 
    padding:6px 15px 6px 15px; 
    color:#000000; 
} 


.textElement_easy { 
    background:#512d5d; 
    padding:10px; 
    color:#FFF; 
} 
.textElement2_easy { 
    background:#FF0000; 
    padding:10px; 
    color:#FFF; 
} 

.allinone_bannerWithPlaylist_texts { 
    position:absolute; 
    z-index:3; 
    display:none; 
    width:100%; 
    text-align:left; 
} 

.allinone_bannerWithPlaylist_text_line { 
    position:absolute; 
} 



.hideElement { 
    display:none; 
} 
+0

jQuery는 어디에 있습니까? –

+0

나는 문자의 양이 제한되어있었습니다 ... http://orhsfoundation.com/allinone_bannerWithPlaylist.js – user1533928

+0

저는 HTML에서 한 이미지 (첫 번째 이미지) 주위에만 태그가 있다는 것을 알고 있습니다. 나머지 태그는 어디에 있습니까? – DextrousDave

답변

0

allinone_bannerWithPlaylist.js 파일에서 잠시 살펴 봅니다. 이미지 태그의 src 속성을 제거하고 생성 한 일련의 div에 대한 배경 이미지로 설정하여 슬라이드 쇼를 생성하는 것 같습니다. 따라서 이미지 (HTML에 넣은 이미지)가 실제로 표시되는 이미지가 아니기 때문에 이미지가 연결되지 않습니다. 그 행동은 "blinds-esque"전환의 열을 허용합니다.

그건 답입니다. 수정에 대한 나의 제안은 여러분의 필요에 더 잘 맞는 다른 jquery 슬라이드 쇼 플러그인을 찾는 것입니다. 기둥 전환을 잃을 수도 있지만 링크를 얻을 수 있습니다.

+0

상황을 설명해 주셔서 감사합니다 ... 당신의 제안에도 불구하고 텍스트 애니메이션을 사용하여이 작업을 할 수있었습니다! – user1533928

관련 문제