WebSite X5Help Center

 
Luigi G.
Luigi G.
User

Inserire un tasto alla pagina web per tornare in cima  it

Autor: Luigi G.
Visitado 2261, Seguidores 2, Compartilhado 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!

Publicado em
10 RESPOSTAS
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)

Ler mais
Publicado em de Fabio B.
Luigi G.
Luigi G.
User
Autor

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.

Ler mais
Publicado em de 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...

Ler mais
Publicado em de Fabio B.
Luigi G.
Luigi G.
User
Autor

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 

Ler mais
Publicado em de Luigi G.
Luigi G.
Luigi G.
User
Autor

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 

Ler mais
Publicado em de Luigi G.
Fabio B.
Fabio B.
User

...prego!

Ler mais
Publicado em de 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

Ler mais
Publicado em de 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 ) -->

Ler mais
Publicado em de Mirko Boschetti
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
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

Ler mais
Publicado em de  ‪ KolAsim ‪ ‪