div fisso che ad un certo punto dello scroll scompare

userjq · 7 Mag 2017

Salve a tutti!
Quesito: ho un'immagine che resta fissa durante lo scroll della pagina.
Vorrei che quando arrivo ad una certa percentuale (o pixel) di scorrimento, ad esempio quando ho scrollato circa il 90% della pagina (o 600px), l'immagine scompaia, ovviamente se poi scrollo verso l'alto deve ricomparire.

Ho creato 'sta cosa, ma non funziona:
CSS
.fisso{width:240px;position:fixed;top:200px;left:75%}

HTML
<img src="foto.png" usemap="#Map" class="fisso" alt="">

JQUERY
<script>
$(function(){
$(window).scroll(function(){
var somma = $("#fisso").height() + 600;
if($(this).scrollBottom()>=somma){
$("#fisso").fadeIn("slow");
}else{
$("#fisso").hide();
}
});
});
</script>

livellacri · 7 Mag 2017

Prova così:

Codice:

<script type="text/javascript">
$(window).scroll(function() {
    if (($(window).height()+$(this).scrollTop())>$(document).height()*90/100) {
        $(".fisso").hide();
    }
    else {
        $(".fisso").fadeIn("slow");
    }
});
</script>

e ricordati di mettere il doctype all'inizio della pagina, altrimenti non funziona:

HTML:

<!DOCTYPE html>

userjq · 11 Mag 2017

livellacri ha scritto:
Prova così:

Codice:

<script type="text/javascript"> $(window).scroll(function() { if (($(window).height()+$(this).scrollTop())>$(document).height()*90/100) { $(".fisso").hide(); } else { $(".fisso").fadeIn("slow"); } }); </script>

e ricordati di mettere il doctype all'inizio della pagina, altrimenti non funziona:

HTML:

<!DOCTYPE html>

Grazie! Funziona

fede12 · 23 Nov 2022

ciao sto provando questa soluzione ma non funziona!!! Il sito è costruito con WordPress tema Avada...

ho provato così ma nulla:

jQuery(document).ready(function($){

Cerca

Cerca

div fisso che ad un certo punto dello scroll scompare

userjq

Nuovo Utente

livellacri

Utente Attivo

userjq

Nuovo Utente

fede12

Nuovo Utente

Discussioni simili