Quantcast
Channel: Últimos conteúdos
Viewing all articles
Browse latest Browse all 14190

Recuperar ancora da Imagem com JQuery

$
0
0

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;
}
 


Viewing all articles
Browse latest Browse all 14190