Good art is a taste, good design is an opinion.


Come as guest, stay as family.
Board Index

Come as guest, stay as family.


You are not connected. Please login or register

Foto

[HTML] Fancy "Scroll up" button



View previous topic View next topic Go down Message [Page 1 of 1]

1
Offline

  Shadow

avatar
Administrator
Administrator


Tutorial: Fancy 'Scroll up' button

This is brand new css3 scroll up design with rocket. It's really nice to have it and can help a lot with speed of scrolling up page.


--> Tutorials, tips and tricks <--
Fancy 'Scroll up' button



- HTML
In [ic]overall_footer_end[/ic] above the [ic]</body>[/ic] put next code:
Code:
[panda=html]    <!-- MrScrollUp.Start -->
    <script type="text/javascript" src="http://yourjavascript.com/460495112/mrscrollup.js"></script>
    <div id="MrScrollUp" style="display:none;"><div class="MrScrollUp1"></div><div class="MrScrollUp2"></div></div>
    <!-- MrScrollUp.End -->


- CSS
Add the following code to the CSS

Code:
[panda=css]    #MrScrollUp div{
    width:149px;
    overflow:hidden;
    position:absolute;
    left:0;
    top:0;
    margin:0;
    padding:0;
    }

    #MrScrollUp .MrScrollUp1{
    background:url(http://i58.servimg.com/u/f58/14/80/95/87/rocket10.png) no-repeat -149px 0;
    opacity:0;
    height:250px;
    display:none;
    z-index:1;
    }

    #MrScrollUp .MrScrollUp2{
    background:transparent;
    cursor:pointer;
    display:block;
    z-index:2;
    height:150px;
    }

    #MrScrollUp{
    z-index:11;
    width:149px;
    height:250px;
    display:block;
    overflow:hidden;
    cursor:default;
    position:fixed;
    right:0;
    top:95%;
    background:url(http://i58.servimg.com/u/f58/14/80/95/87/rocket10.png) no-repeat 0 0;
    margin:-125px 0 0;
    padding:0;
    }


- Preview





© PunBB Design


If you have any questions related to this topic create a topic with the following title:
Fancy 'Scroll up' button

Powered by PunBB
Currently 0 users have thanked Shadow for this post:

2
Offline

  mcdkjk

avatar
Newbie
Newbie
It is just perfect !
Thanks!
Only one question!
Is it possible to add sound when someone click on it ?
Thanks again!

Powered by PunBB
Currently 0 users have thanked mcdkjk for this post:

View previous topic View next topic Back to top Message [Page 1 of 1]


Topic URL's

URL
BBcode
HTML" />

Permissions in this forum:
You cannot reply to topics in this forum