tech @ Beacon Deacon

Refresher - Jamie Johnson

Jamie Johnson

May 12, 2016

Want to put a clickable refresher arrow (something to click to refresh your page) on your page, perhaps within it as seen here (below and right)?

This could be useful for resetting sorts or searches with DataTables (see earlier articles) or if you want to put a refresh option in a more convenient place on a page.

Here's the code to do it:

<style type="text/css">
p#refresher { text-align:right; }
p#refresher span { 
    display:inline-block; 
    font-size: 1.5em; 
    -ms-transform: rotate(90deg); /* ie 9 */ 
    -webkit-transform: rotate(90deg); /* chrome, safari, opera */ 
    transform: rotate(90deg);
    cursor: pointer;
    font-weight: bold;
}
</style>
<p id="refresher">
<span onclick="location.href=window.location" title="refresh">&#8635;</span></p>

Back to top