WebSite X5Help Center

 
Luigi G.
Luigi G.
User

Inserire un tasto alla pagina web per tornare in cima  it

Autore: Luigi G.
Visite 2084, Followers 2, Condiviso 0  

Ciao, vorrei aggiungere al mio sito un tasto (o icona) che scorra insieme alla pagina (sul lato destro) facendo in modo che quando ci clicchi sopra ti riporta in cima alla stessa pagina.

per intenderci (allego una foto) come quando fai una ricerca su ebay quando scorri la pagina verso il basso ti esce una freccetta che cliccandola ti riporta in cima.

Come posso fare???

Grazie mille per l'aiuto!

Postato il
10 RISPOSTE
Fabio B.
Fabio B.
User

Puoi anche inserire l'immagine allegata al passo 4 > codice > esperto > Aggiungi file > percorso: images;

poi inserisci al passo 4 > codice > esperto questo script:

<style>

#imFooter {
position: fixed !important;
bottom: 0 !important;
z-index: 10 !important;
}
</style>

quindi inserisci nel footer un oggetto html con dentro:

<a onclick="return x5engine.utils.location('#', null, false)" href="#">
<img width="50" height="50" src="../images/back-to-top.png">
</a>

se ti fa comodo in aggiunta puoi anche settare lo sfondo del footer trasparente (se il bottone di ritorno é l'unico contenuto)

Leggi di più
Postato il da Fabio B.
Luigi G.
Luigi G.
User
Autore

Ok innanzitutto grazie mille per l'aiuto...poi volevo chiedere a Mirko una volta scaricato http://mattvarone.com/web-design/uitotop-jquery-plugin/ e "zippato" va messo solo nella cartella pubblicata del sito oppure oltre ad essere pubblicato deve essere anche implementato un codice all'interno del sito tramite il "passo4-codice-esperto?"

per info: Ho provato a pubblicare le cartelle scaricate ovviamente tranne la pagina "index" ma non funziona.

Per Fabio: grazie mille per la tua soluzione ma non mi piace molto l'effetto del footer sempre in primo piano e non posso farlo trasparente poichè ci sono già dei contenuti.

Leggi di più
Postato il da Luigi G.
Fabio B.
Fabio B.
User

puoi anche inserire quello script html in una cella html invece che nel footer (dopo un'altra cella o solo a fondo pagina) dando l'altezza di 50px (oppure una immagine più piccola e quindi un'altezza cella uguale azzerando margine e padding della cella); poi fa come preferisci; se preferisci integrare nel tuo progetto risorse esterne al programma...

Leggi di più
Postato il da Fabio B.
Luigi G.
Luigi G.
User
Autore

Ci sono arrivato!!! Nel caso serva a qualcuno la risposta alla mia domanda è:

Si bisogna inserire al "passo4-codice-esperto" il seguente codice (prima della chiusura del tag HEAD)

<meta charset="utf-8"/>
<title>UItoTop jQuery Plugin - Matt Varone</title>
<meta name="author" content="www.mattvarone.com">
<link rel="stylesheet" media="screen,projection" href="css/ui.totop.css" />
<meta name="viewport" content="width=device-width; initial-scale=1"/>

<!-- jquery -->
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<!-- easing plugin ( optional ) -->
<script src="js/easing.js" type="text/javascript"></script>
<!-- UItoTop plugin -->
<script src="js/jquery.ui.totop.js" type="text/javascript"></script>
<!-- Starting the plugin -->
<script type="text/javascript">
$(document).ready(function() {
/*
var defaults = {
containerID: 'toTop', // fading element id
containerHoverID: 'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
};
*/

$().UItoTop({ easingType: 'easeOutQuart' });

});
</script>

Se qualcuno vuole aggiungere qualcosa per migliorare o correggere il mio commento fate pure...potrebbe servire anche a me 

Leggi di più
Postato il da Luigi G.
Luigi G.
Luigi G.
User
Autore

mmm...Fabio effettivamente anche questa potrebbe essere un'ottima soluzione (non ci avevo pensato).

La testerò comunque così da poter avere più scelte a mia disposizione...Grazie 

Leggi di più
Postato il da Luigi G.
Fabio B.
Fabio B.
User

...prego!

Leggi di più
Postato il da Fabio B.
Fabio B.
Fabio B.
User

puoi anche fare lo stesso lavoro usando l'oggetto immagine con lo stesso link, invece che un oggetto codice

Leggi di più
Postato il da Fabio B.
Mirko Boschetti
Mirko Boschetti
Moderator

@Luigi elimina queste righe:

<meta charset="utf-8"/>
<title>UItoTop jQuery Plugin - Matt Varone</title>
<meta name="author" content="www.mattvarone.com">                                               <meta name="viewport" content="width=device-width; initial-scale=1"/>

<!-- jquery -->
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<!-- easing plugin ( optional ) -->

Leggi di più
Postato il da Mirko Boschetti
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Utente del mese FRUtente del mese PL
Luigi G.
... ... ... ... ... ... Se qualcuno vuole aggiungere qualcosa per migliorare o correggere il mio commento fate pure...potrebbe servire anche a me 

... non posso valutare il tuo codice perchè non ho il Programma, ma segui il consiglio di MirKo, perchè quello che ti ha segnalato è superfluo essendo stringhe già gestite dal Programma...
... ... però in aggiunta potrebbe interessarti riuscire a fare tutto da te, senza codici esterni, se non con il solito DIV_CUSTOM:
... come idea vedi i miei esempi postati in altri Argomenti simili:
http://www.zspace.it/kolasim/div_custom/divcustomAngoloK_3.html
http://www.zspace.it/kolasim/div_custom/divcustomAngoloK_3scroll.html
... basta che fai il copia/incolla dello SCRIPT (2°es.) in HEAD e del DIV_CUSTOM nel BODY (/BODY), e ti funzionerà subito anche in Anteprima anche se come detto non posso verificare...
.


ciao

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪