» »

Кнопка вверх для сайта с процентами CSS

Кнопка вверх для сайта с процентами CSS

Оригинальный скрипт с функцией поднятие странице вверх, где у кнопки будет отсчитывать в процентном соотношение при работе высоту. Так она не чем не отличается от других, что по функциональности схожие, но здесь у вас будет возможность сменить само изображение и что о поставить оригинальное. Если тематическая площадка, то здесь не важно стрелка, что то свое уникальное можно увидеть.

Установка:

В самый низ CSS вставляйте:

Код
#back-top {  
position: fixed;  
width: 50px;  
height: 100px;  
z-index: 6;  
right: 25px;  
bottom:0;  
background-color: transparent;  
display: block;  
background-position: initial initial;  
background-repeat: initial initial;  
  }

Следующий код в самый низ страницы после < /body >:

Код
<div id="back-top">  
<center>  
<a title="Вверх" id="backop" href="#top">  
<img src="http://zornet.ru/_ld/52/79363953.png" />  
</a>  
<font color="#000000" size="3">  
<span id="pix">0</span>%</font>  
</center>  
  </div>  

  <script>  
  $(window).scroll(function () {  
var s = $(window).scrollTop();  
var f = $(document).height() - $(window).height();  
var d = s / f * 100;  
var p = Math.round(d);  
$("#pix").text(p);  
  });  
  </script>

Здесь нужно заметить, что изображение должно по умолчанию идти в рамках задонной ширины и длинны, так как в скрипте только регулируется место, где по умолчанию стоять будет.

Демонстрация
20.10.2017 Просмотров: 303 Комментарий: (0)

Поделиться в социальных сетях

Материал разместил

Комментарий: 0
avatar