Перемещение дива во время скролинга страницы - Visavi.net
https://visavi.net/
RSS - Visavi.nethttps://visavi.net/assets/img/images/logo_small.pngRSS - Visavi.net
https://visavi.net/
[email protected] (admin)[email protected] (admin)Sun, 24 Nov 2024 07:23:44 +0300Угу, поправил..
https://visavi.net/topics/25781/435419
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 22:27:48 +0400Сообщенияhttps://visavi.net/topics/25781/435419$('#head_tabs').css('position', 'fixed');<br>
а разве не проще сделать вот так<br>
$('#head_tabs').css({position:'fixed', top: '0px', opacity: '0.3'});
https://visavi.net/topics/25781/435414
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 22:21:06 +0400Сообщенияhttps://visavi.net/topics/25781/435414<blockquote class="blockquote"><strong>ramzes</strong> (20 Октября 2011 / 00:12)<br>
fixed как и absolute позиционируется не влияя на другие элементы (для них, просто нет этих блоков</blockquote>
В этом и проблема.. Изначально небыло никаких fixed и всё было ок, но после fixed, этот блок как бы убирается из разметки..<br>
Вот пришлось выправлять. А в случае если javascript не включён, мне этот fixed не нужен, поэтому включаю я его скриптом.. короче это решение чисто для моей разметки. Уверен, что можно и проще.
https://visavi.net/topics/25781/435413
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 22:17:44 +0400Сообщенияhttps://visavi.net/topics/25781/43541315. <strong>valerik</strong>, у тебя там вообще много странного)) там реально 3-5 строк простейшего кода<br>
я выше пример писал<br>
<br>
<em><span style="font-size:x-small">Добавлено через 01:52 сек.</span></em><br>
<blockquote class="blockquote"><strong>valerik</strong> (19 Октября 2011 / 21:59)<br>
да чёто разметка слетала после $('#head_tabs').css('position', 'fixed');</blockquote>
fixed как и absolute позиционируется не влияя на другие элементы (для них, просто нет этих блоков
https://visavi.net/topics/25781/435412
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 22:12:37 +0400Сообщенияhttps://visavi.net/topics/25781/435412<blockquote class="blockquote"><strong>ramzes</strong> (20 Октября 2011 / 00:04)<br>
13. <strong>valerik</strong>, а чем хвалишься то? не заметил там фиксированных блоков вообще<img src="https://visavi.net/uploads/stickers/smile.gif" alt="smile"> <br>
</blockquote>
Чёто с хрома не пашет <img src="https://visavi.net/uploads/stickers/sad.gif" alt="sad"> <br>
С других браузеров норм<br>
<br>
<blockquote class="blockquote">$("id").hover(function(){<br>
наведение<br>
},<br>
function(){<br>
отведение<br>
});</blockquote>
А вот за это спасибо, не знал
https://visavi.net/topics/25781/435411
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 22:09:09 +0400Сообщенияhttps://visavi.net/topics/25781/43541113. <strong>valerik</strong>, а чем хвалишься то? не заметил там фиксированных блоков вообще<img src="https://visavi.net/uploads/stickers/smile.gif" alt="smile"> <br>
<br>
<em><span style="font-size:x-small">Добавлено через 02:30 сек.</span></em><br>
$('#head_tabs').hover(function(){$('#head_tabs').css('opacity','1');}); <br>
$('#head_tabs').mouseleave(function(){if(document.documentElement.scrollTop > header_def_top+70){$('#head_tabs').css('opacity','0.3');}}); <br>
hover() имеет две части, начало и конец<br>
$("id").hover(function(){<br>
наведение<br>
},<br>
function(){<br>
отведение<br>
});
https://visavi.net/topics/25781/435409
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 22:04:58 +0400Сообщенияhttps://visavi.net/topics/25781/435409да чёто разметка слетала после $('#head_tabs').css('position', 'fixed');<br>
пришлось всё это городить.. позиции выставлять.. всякие соседнии элементы тоже..<br>
<br>
Кроме того я сделал всякие фишки.. типа прозрачности..<br>
и при наведении снова в полную видимость.
https://visavi.net/topics/25781/435405
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 21:59:42 +0400Сообщенияhttps://visavi.net/topics/25781/43540511. <strong>valerik</strong>, зачем так много индийского кода <img src="https://visavi.net/uploads/stickers/obana.gif" alt="obana">
https://visavi.net/topics/25781/435404
Перемещение дива во время скролинга страницы ДмитрийWed, 19 Oct 2011 21:57:43 +0400Сообщенияhttps://visavi.net/topics/25781/435404Всё сделал. Не могу не <a href="http://scades.ru/" target="_blank" rel="nofollow">похвастаться</a>, не сочтите за рекламу.<br>
<br>
Код замудрил сложный.. jquery<br>
<pre class="prettyprint">
//Навигация при скроллинге
$('#head_tabs').css('top', '55');
var header_def_top = 55;
var header_def_back =$('#tabs').css('background-image');
var header_def_col =$('#tabs').css('background-color');
$(window).bind("scroll",function(){
if(document.documentElement.scrollTop > header_def_top+70)
{
$('#head_tabs').css('position', 'fixed');
$('#after_head').css('margin-top', '145px');
$('#tabs').css('margin-top', '0px');
$('#head_tabs').css('top','0px');
$('#head_tabs').css('opacity','0.3');
$('#tabs').css('background-image','none');
$('#tabs').css('background-color','inherit');
}
else
{
$('#head_tabs').css('position', 'static');
$('#after_head').css('margin-top', '0px');
$('#tabs').css('margin-top', '70px');
$('#head_tabs').css('top',header_def_top);
$('#head_tabs').css('opacity','1');
$('#tabs').css('background-image',header_def_back);
$('#tabs').css('background-color',header_def_col);
}
});
$('#head_tabs').hover(function(){$('#head_tabs').css('opacity','1');});
$('#head_tabs').mouseleave(function(){if(document.documentElement.scrollTop > header_def_top+70){$('#head_tabs').css('opacity','0.3');}});
//-------------------------
</pre>
https://visavi.net/topics/25781/435400
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 21:53:06 +0400Сообщенияhttps://visavi.net/topics/25781/4354009. <strong>dima.london</strong>, в смысле?<br>
кстати, вот css яндекса<br>
.b-head-floater_fixed_yes .b-head-search {<br>
<span style="color:#ff0000">position: fixed;</span><br>
top: 0;<br>
}<br>
без этого не работает у них))<br>
<br>
<em><span style="font-size:x-small">Добавлено через 05:51 сек.</span></em><br>
$(window).bind("scroll",function(){<br>
if(pageYOffset != $("#full-header").css("top")){<br>
// $("#full-header").animate({top: pageYOffset-1+"px"}, 100);<br>
$("#full-header").css({top: pageYOffset-1+"px"});<br>
}<br>
}<br>
full-header это ид фиксированного блока
https://visavi.net/topics/25781/435365
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 20:49:08 +0400Сообщенияhttps://visavi.net/topics/25781/4353658. <strong>ramzes</strong>, не понял прикола че-то <img src="https://visavi.net/uploads/stickers/cry.gif" alt="cry">
https://visavi.net/topics/25781/435363
Перемещение дива во время скролинга страницы ДмитрийWed, 19 Oct 2011 20:47:12 +0400Сообщенияhttps://visavi.net/topics/25781/4353637. <strong>valerik</strong>, она догоняет экран)) мне так больше нравится, можно без эффекта сделать
https://visavi.net/topics/25781/435360
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 20:44:31 +0400Сообщенияhttps://visavi.net/topics/25781/435360<blockquote class="blockquote"><strong>ramzes</strong>http://wap.smartoff.net/user/files/1/ 30 секунд, кто быстрее?))</blockquote>
Чё она у тебя ездит туда сюда? <img src="https://visavi.net/uploads/stickers/E.gif" alt="E">
https://visavi.net/topics/25781/435358
Перемещение дива во время скролинга страницы ВалерийWed, 19 Oct 2011 20:41:56 +0400Сообщенияhttps://visavi.net/topics/25781/4353585. <strong>dima.london</strong>, jquery там, ajax вообще для другого нужен))<br>
я знаю что там. 3 строчки кода просто css куда легче для браузера<br>
<a href="http://wap.smartoff.net/user/files/1/" target="_blank" rel="nofollow">http://wap.smartoff.net/user/files/1/</a> 30 секунд, кто быстрее?))
https://visavi.net/topics/25781/435357
Перемещение дива во время скролинга страницы ramzesWed, 19 Oct 2011 20:38:37 +0400Сообщенияhttps://visavi.net/topics/25781/4353572. <strong>ramzes</strong>, нет, Рома, там аякс. Надо просчитать положение блока на странице с учетом количества пикселов скроллинга, и если они 0 или меньше - закреплять блок (приклеивать к верху), меняя значения css как ты написал выше, и параллельно пряча ненужные ссылки вокруг. Если же вернулись назад к верху (кол-во скроллинга 0), возвращать блоку position:relative и открывать скрытые ссылки. <br>
Я вижу это так.
https://visavi.net/topics/25781/435354
Перемещение дива во время скролинга страницы ДмитрийWed, 19 Oct 2011 20:31:32 +0400Сообщенияhttps://visavi.net/topics/25781/435354