Самый простой вариант разместить на полях сайта блок, это использовать css.
Это будет выглядеть так.
HTML:
<div class="vopros-wrap"> <a class="vopros-button" href="#">Знак вопроса</a> <a class="vopros-text" href="#">Задайте вопрос</a> </div>
И CSS:
.vopros-wrap{
position: fixed;
right: -0px;
top: 200px;
}
А можно еще вопрос размещения блока на полях сайта решить с помощью jQuery. С добавлением визуального эффекта - смещение блока при прокрутке страницы и возвращения его на прежнее место.
CSS для этого варианта:
body{
overflow-x:hidden;
}
.vopros-wrap{
position:absolute;
right: -200px;
top: 200px;
}
.vopros-wrap:hover{
right: 0px;
transition:0.25s linear all;
-webkit-transition:0.25s linear all;
-moz-transition:0.25s linear all;
-o-transition:0.25s linear all;
}
.vopros-wrap:hover .vopros-text{
visibility:hidden;
}
.vopros-button{
display:block;
position:absolute;
width:50px;
height:50px;
background:#ccc;
left:-50px;
top:0;
box-sizing:border-box;
}
.vopros-text{
display:block;
width:200px;
height:auto;
background:#0000ff;
min-height:50px;
box-sizing:border-box;
visibility:hidden;
}
Javascript:
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(window).scroll(function(){
var bo = jQuery(this).scrollTop();
if ( bo >= 10) {
var top = bo + 200 + 'px';
jQuery(".vopros-wrap").stop().css('display', 'block').animate({'top':top},500);
}
});
});
</script>