djgelius
Новичок
Здравствуйте! Подскажите как скрыть в этом коде при поднятии вверх после ссылки тег #top
Так показывает: http://site.ru/post.html#top
<!--Вверх-->
<style type="text/css">
#message a
{
/* display: block before hiding */
display: block;
display: none;
/* link is above all other elements */
z-index: 999;
/* link doesn't hide text behind it */
opacity: .8;
/* link stays at same place on page */
position: fixed;
/* link goes at the bottom of the page */
top: 100%;
margin-top: -40px;
/* = height + preferred bottom margin */
/* link is centered */
left: 50%;
margin-left: -110px;
/* = half of width */
/* round the corners (to your preference) */
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
/* make it big and easy to see (size, style to preferences) */
width: 180px;
line-height: 15px;
height: 15px;
padding: 10px;
background-color: #FFF;
font-size: 20px;
text-align: center;
color: #000;
border-radius:10px;
border:2px solid #000;/* solid, dotted, dash ... */
</style>
<div id="top">
</div>
<!-- здесь должно находится основное содержимое страницы -->
<div id="message">
<a href="#top">
Подняться наверх
</a>
</div>
<script type="text/javascript">
$(function () {
/* set variables locally for increased performance */
var scroll_timer;
var displayed = false;
var $message = $('#message a');
var $window = $(window);
var top = $(document.body).children(0).position().top;
/* react to scroll event on window */
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () {
if($window.scrollTop() <= top)
{
displayed = false;
$message.fadeOut(500);
}
else if(displayed == false)
{
displayed = true;
$message.stop(true, true).show().click(function () {
$message.fadeOut(500);
}
);
}
}
, 100);
}
);
}
);
</script>
<!--Вверх end -->
Так показывает: http://site.ru/post.html#top
<!--Вверх-->
<style type="text/css">
#message a
{
/* display: block before hiding */
display: block;
display: none;
/* link is above all other elements */
z-index: 999;
/* link doesn't hide text behind it */
opacity: .8;
/* link stays at same place on page */
position: fixed;
/* link goes at the bottom of the page */
top: 100%;
margin-top: -40px;
/* = height + preferred bottom margin */
/* link is centered */
left: 50%;
margin-left: -110px;
/* = half of width */
/* round the corners (to your preference) */
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
/* make it big and easy to see (size, style to preferences) */
width: 180px;
line-height: 15px;
height: 15px;
padding: 10px;
background-color: #FFF;
font-size: 20px;
text-align: center;
color: #000;
border-radius:10px;
border:2px solid #000;/* solid, dotted, dash ... */
</style>
<div id="top">
</div>
<!-- здесь должно находится основное содержимое страницы -->
<div id="message">
<a href="#top">
Подняться наверх
</a>
</div>
<script type="text/javascript">
$(function () {
/* set variables locally for increased performance */
var scroll_timer;
var displayed = false;
var $message = $('#message a');
var $window = $(window);
var top = $(document.body).children(0).position().top;
/* react to scroll event on window */
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () {
if($window.scrollTop() <= top)
{
displayed = false;
$message.fadeOut(500);
}
else if(displayed == false)
{
displayed = true;
$message.stop(true, true).show().click(function () {
$message.fadeOut(500);
}
);
}
}
, 100);
}
);
}
);
</script>
<!--Вверх end -->
