Su JSFiddle va, mentre sulla mia pagina no! Xche?
Penso sia un problema semplicissimo, ma mi ci sto scervellando da 2 ore e non riesco a risolverlo. Premesso che non conosco il javascript ed è la seconda volta che mi cimento a scriverne un pezzetto, sono riuscito a scrivere il codice che mi serviva (serve a cambiare classe scendendo cn lo scroll) e che su JSFiddle funziona, guardate:
http://jsfiddle.net/7edk7rb4/
Mentre una volta messo sulla pagina del mio sito non funziona più. Io penso di aver scritto tutto giusto, ma non funziona :cry:, qualcuno mi sa dire dov'è l'errore... penso sia una cosa semplice no? Qui il link alla mia pagina e qui il codice:
Codice HTML:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(function() {
$('#info').affix({
offset: { top: $('#salve').offset().top }
});
});
</script>
<style type="text/css">
.affix {font-size: 20px !important; color: blue !important; position: fixed; top: 0px; width: 100%;}
.wo1{font-size: 15px; color: black;}
</style>
</head>
<body>
<div id="info" style="height: 50px;" class="wo1">Ciao</div>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
<div id="salve"></div>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!<br><br>
ehila!
</body>
</html>
