Кнопки "Назад", "Вверх" и "Вниз"

Опубліковано 13 жовтня, 20159 р

Адміністратор

Админ Панель-Внешний вид-Ваш стиль-Глобальные-globalTemplate найти:

<body id='ipboard_body'>

После вставить:

<a href="javascript:history.back(0)" onmouseover="window.status='Назад';return true" class="ctrleft"></a> <a class="bgbacktotop" href="#top" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');return false;" ></a> <a class="bgbacktobot" href="#bottom" onclick="jQuery('html, body').animate({scrollTop:document.documentElement.scrollHeight}, 'slow');return false;" ></a>

Админ Панель-Внешний вид-Ваш стиль-css-ipb_styles.css вставить у самый низ:

.ctrleft { 
  background: url({style_images_url}/backk.png")no-repeat center; 
  width: 50px; 
  height: 100%; 
  z-index: 0; 
  position: fixed; 
  top: 0; 
  opacity: 0.4; 
  -webkit-transition: all .7s ease-in-out; 
  -moz-transition: all .7s ease-in-out; 
  -o-transition: all .7s ease-in-out; 
  -ms-transition: all .7s ease-in-out; 
  transition: all .7s ease-in-out; 
} 
.ctrleft:hover, .ctrright:hover { 
  opacity: 1.0; 
} 
a.bgbacktotop { 
  position: fixed; 
  top:45%; 
  opacity: 0.4; 
  right: 2px; 
  width: 48px; 
  height: 48px; 
  display: block; 
  background: url({style_images_url}/go_top.png) no-repeat 0px 0px; 
  z-index: 99999999; 
  -webkit-transition: all .7s ease-in-out; 
  -moz-transition: all .7s ease-in-out; 
  -o-transition: all .7s ease-in-out; 
  -ms-transition: all .7s ease-in-out; 
  transition: all .7s ease-in-out; 
} 
a.bgbacktotop:hover { 
  opacity:1; 
} 
a.bgbacktobot { 
  position: fixed; 
  top:55%; 
  opacity: 0.4; 
  right: 2px; 
  width: 48px;
  height: 48px; 
  display: block; 
  background: url({style_images_url}/go_bottom.png) no-repeat scroll 0px 0px transparent; 
  z-index: 99999999; 
  -webkit-transition: all .7s ease-in-out; 
  -moz-transition: all .7s ease-in-out; 
  -o-transition: all .7s ease-in-out; 
  -ms-transition: all .7s ease-in-out; 
  transition: all .7s ease-in-out; 
} 
a.bgbacktobot:hover { 
  opacity:1; 
}

Загрузить картинки на фтп у ваш стиль:

Картинки.zip

Змінено 9 лютого, 20178 р користувачем Ciko

3 тижня через...

Опубліковано 2 листопада, 20159 р

Автор
Адміністратор

А как слева сделать:

.ctrleft {background:  url("{style_images_url}/backk.png")no-repeat center;width: 50px;height: 100%;z-index: 0;position: fixed;top: 0;right: 0;/*Переворачивает стрелку на 180 градусов*/-moz-transform: rotate(180deg); /* Для Firefox */-ms-transform: rotate(180deg); /* Для IE */-webkit-transform: rotate(180deg); /* Для Safari, Chrome, iOS */-o-transform: rotate(180deg); /* Для Opera */transform: rotate(180deg);/**/opacity: 0.4;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}.ctrleft:hover, .ctrright:hover {opacity: 1.0;}a.bgbacktotop {position: fixed;top:45%;opacity: 0.4;left: 2px;width: 48px;height: 48px;display: block;background: url({style_images_url}/go_top.png) no-repeat 0px 0px;z-index: 99999999;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}a.bgbacktotop:hover {opacity:1;}a.bgbacktobot {position: fixed;top:55%;opacity: 0.4;left: 2px;width: 48px;height: 48px;display: block;background: url({style_images_url}/go_bottom.png) no-repeat scroll 0px 0px transparent;z-index: 99999999;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}a.bgbacktobot:hover {opacity:1;}

6 місяців через...

Опубліковано 5 травня, 20168 р

В 13.10.2015 в 19:39, Ciko сказал:

Админ Панель-Внешний вид-Ваш стиль-Глобальные-globalTemplate найти:


<body id='ipboard_body'>

После вставить:


<a href="javascript:history.back(0)" onmouseover="window.status='Назад';return true" class="ctrleft"></a> <a class="bgbacktotop" href="#top" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');return false;" ></a> <a class="bgbacktobot" href="#bottom" onclick="jQuery('html, body').animate({scrollTop:document.documentElement.scrollHeight}, 'slow');return false;" ></a>

Админ Панель-Внешний вид-Ваш стиль-css-ipb_styles.css вставить у самый низ:


.ctrleft {background:  url({style_images_url}/backk.png")no-repeat center;width: 50px;height: 100%;z-index: 0;position: fixed;top: 0;opacity: 0.4;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}.ctrleft:hover, .ctrright:hover {opacity: 1.0;}a.bgbacktotop {position: fixed;top:45%;opacity: 0.4;right: 2px;width: 48px;height: 48px;display: block;background: url({style_images_url}/go_top.png) no-repeat 0px 0px;z-index: 99999999;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}a.bgbacktotop:hover {opacity:1;}a.bgbacktobot {position: fixed;top:55%;opacity: 0.4;right: 2px;width: 48px;height: 48px;display: block;background: url({style_images_url}/go_bottom.png) no-repeat scroll 0px 0px transparent;z-index: 99999999;-webkit-transition: all .7s ease-in-out;-moz-transition: all .7s ease-in-out;-o-transition: all .7s ease-in-out;-ms-transition: all .7s ease-in-out;transition: all .7s ease-in-out;}a.bgbacktobot:hover {opacity:1;}

Загрузить картинки на фтп у ваш стиль:

Картинки.zip

Нету в данном шаблоне этогоко да