div fisso che ad un certo punto dello scroll scompare

U

userjq

Nuovo Utente
7 Mag 2017
2
0
1
45
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

livellacri

Utente Attivo
18 Ago 2016
108
13
18
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>
 
  • Like
Reactions: userjq
U

userjq

Nuovo Utente
7 Mag 2017
2
0
1
45
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>
Clicca per allargare...
Grazie! Funziona :)
 
F

fede12

Nuovo Utente
22 Nov 2022
4
0
1
ciao sto provando questa soluzione ma non funziona!!! Il sito è costruito con WordPress tema Avada...

ho provato così ma nulla:

jQuery(document).ready(function($){
 
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
P div fisso con offset() o position() jQuery 2
K div fisso ma..... HTML e CSS 3
N Div metà fisso e metà scroll HTML e CSS 4
felino [HTML] DIV menu fisso durante lo scroll HTML e CSS 5
E Creare un testo trasparente dietro un div HTML e CSS 5
F Div position: fixed si deve fermare quando raggiunge un altro div, oppure deve scomparire. Soluzioni? Javascript 0
M Accordion menu e posizione div HTML e CSS 0
P jquery refresh div non funziona Javascript 0
P refresh div + scrittura/lettura dal db Javascript 1
napuleone div centrato alla pagina posto sopra ai contenuti HTML e CSS 1
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
Cosina Nascondere div di default jQuery 2
napuleone modificare il contenitore di un div Javascript 2
napuleone modificare il contenitore di un div Javascript 1
A inserire variabile php colore in div html PHP 2
J Far comparire e scomparire un div con un select Javascript 1
T Far sparire dalla pagina div che saranno inseriti successivamente jQuery 0
E Div che scompare con scroll jquery Javascript 0
G Aiuto HTML, collegamento con un bottone a una <div> di un' altra pagna HTML e CSS 5
Stefano Migotto Creazione di un div con php o js PHP 9
felino Bootstrap alert: usare lo stesso div per due messaggi consecutivi jQuery 1
S Visibilità div in PHP PHP 1
L [Javascript]Scorrere div con frecce avanti-indietro Javascript 0
P [Javascript] Aprire Link in Div e pagina Dinamica Javascript 0
ANDREA20 [HTML] problema con i div HTML e CSS 10
Giacomo Boccherini [HTML] il div non si ottimizza HTML e CSS 1
Cosina [PHP] Scrivere dati in un div specifico PHP 3
R [PHP] [Javascript] Link a DIV id di un' altra pagina PHP 4
trattorino [Javascript] onclick su piu div insieme Javascript 1
trattorino ritornare al div precedente jQuery 2
L [Javascript]Aprire div con click e chiuderlo con altro pulsante Javascript 2
V [Javascript] Visualizzare o nascondere div figlio Javascript 4
E [HTML] Allineare foto a un tag DIV verticalmente HTML e CSS 0
E [HTML] Allineamento immagine agli angoli inferiori di un div HTML e CSS 12
A JAVASCRIPT ELIMINAZIONE DIV DINAMICO SU SITO Offerte e Richieste di Lavoro e/o Collaborazione 3
Andrea_Ventura [HTML] Creare un DIV con slideshow HTML e CSS 5
M [HTML] Invertire DIV su dispositivi mobile HTML e CSS 2
A Javascript Nascondere Div con id numerico dinamico Javascript 18
I [HTML] Slideshow si sovrappone a <div> HTML e CSS 14
paloppa Div che appare appena due form sono compilati jQuery 16
S [javascript] visualizzare/nascondere div Javascript 3
S [HTML] Centrare verticalmente il testo in div HTML e CSS 2
G [HTML] Modificare ordine dei div in mobile responsive HTML e CSS 5
D [HTML] Frameset e Div HTML e CSS 8
G [HTML] Impostare dimensione immagini in un div HTML e CSS 2
L php - pulsante premuto che mostra #div PHP 3
S [HTML] Div visibile o nascosto al passaggio del mouse HTML e CSS 3
C [Javascript] Mostrare un div cliccando una checkbox Javascript 0
M Ottenere i valori di una proprietà su un array di oggetti (es. DIV) in JavaScript Javascript 7
C Nascondere un div al click di una casella Ajax 1

Discussioni simili

Alto Basso