Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

cairo.ramos

Recuperar ancora da Imagem com JQuery

Recommended Posts

boa tarde, galera to com o seguinte problema, não estou conseguindo recuperar a ancora da imagem com JQuery, pois preciso do link que está no a para poder aplicar o link em um src de um box, segue codigo abaixo:

 

html

 

<button class="btn-a">show img</button>
<div class="slider">
<a id="eprevent" href="http://travel.padi.com/Assets/Temp/FRENCH%20POLYNESIA/PF-BOBMP/Web/Originals/Maitai%20Polynesia%20overwater%202.jpg">
<img class="draft-img1" src="http://www.autoblog.pt/wp-content/uploads/2012/08/Ferrari-F70-David-Williams_1.jpg" alt="imagem de teste" />
</a>

<a id="eprevent" href="http://travel.padi.com/Assets/Temp/FRENCH%20POLYNESIA/PF-BOBMP/Web/Originals/Maitai%20Polynesia%20overwater%202.jpg">
<img class="imagem-de-teste" src="https://magawallpaper.files.wordpress.com/2012/11/wallpapercarrotunadoneonverdebyhi-legalfotosecapas.jpg" alt="imagem de teste" />
</a>
</div>



<button class="btn-b">aplicar img</button>
<section class="block-high">
<img src="" alt="" class="img-high" id="img-hg"/>
</section>

 

 

JavaScript

 

$(document).ready(function(){
//SHOW GALERY IMG
$('.btn-a').click(function(){
$('.draft-img1, .imagem-de-teste').slideToggle();
});

//CANCELAR ACAO DA ANCORA HTML
$('a#eprevent').click(function(event){
event.preventDefault();
});

//RECUPERAR O SCR="" DA IMAGEM SELECIONADA
$('a#prevent').click(function(){
var draft_img = $('a#prevent').attr('src');
});

//APLICA O SRC="" RETORNADO A BOX
var img123 = 'http://4.bp.blogspot.com/-cGqAbpnRLq4/T9Sy20oGtgI/AAAAAAAH3Oo/L7_748Lvrqo/s1600/Ferrari-365-Turin-3.jpg';
$('.btn-b').click(function(){
$('.block-high .img-high').attr('src'.img123);
});

});

 

 

CSS

 

.btn-b, .btn-a{
display: block;
background-color: royalblue;
color: #FFF;
border-radius: 10px;
padding: 10px 20px;
font-size: 15pt;
border: none;
text-transform: uppercase;
cursor: pointer;
}
.imagem-de-teste,.draft-img1{
width: 400px;
height: auto;
display: none;
}
.block-high{
display: block;
width: 600px;
height: 400px;
background-color: royalblue;
position: absolute;
bottom: 2px;
}
img#img-hg{
width: 600px;
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.