Buongiorno a tutti, ho un dubbio che non riesco a capire solo.
Perchè la parte relativa a .hover() non funziona e mi blocca tutto lo script?
Vorrei cambiare icona sostituendo l'icona tramite il cambio di classe di <i> ma non va.
Ecco la pagina completa.. basta copiarla per testarla.. ( è un semplice pulsante.. )
Grazie
Perchè la parte relativa a .hover() non funziona e mi blocca tutto lo script?
Vorrei cambiare icona sostituendo l'icona tramite il cambio di classe di <i> ma non va.
Ecco la pagina completa.. basta copiarla per testarla.. ( è un semplice pulsante.. )
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento senza titolo</title>
<style>
#scarica-listino{
padding: 15px 20px;
border: 2px solid #1a78b7;
position: relative;
color: #1a78b7;
cursor:pointer;
min-width: 170px;
max-width: 200px;
}
#scarica-listino>span{
display: block;
margin-left: 25px;
}
#scarica-listino>small{
margin-left: 25px;
}
#scarica-listino>i{
position: absolute;
left: 12px;
line-height: 30px;
font-size: 24px;
color: #F0700D;
}
</style>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function(){
$("#scarica-listino").click(function(e) {
e.preventDefault(); //stop the browser from following
window.location.href = 'uploads/file.doc';
});
});
$(document).ready(function(){
$("#scarica-listino").hover( function() {
$(this).find( "i" ).toggleClass("fa-download fa-check");
}
});
});
</script>
</head>
<body>
<div id="scarica-listino">
<i class="fa fa-download" aria-hidden="true"></i>
<span>Scarica il Listino 2017</span>
<small>1.2Mb - Pdf</small>
</div>
</body>
</html>
Grazie
Ultima modifica: