Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Закрытая тема
Ваша тема закрыта, почему это могло произойти? Возможно,
Нет наработок или кода, если нужно готовое решение - создайте тему в разделе Фриланс и оплатите работу.
Название темы включает слова - "Помогите", "Нужна помощь", "Срочно", "Пожалуйста".
Название темы слишком короткое или не отражает сути вашего вопроса.
Тема исчерпала себя, помните, один вопрос - одна тема
Прочитайте правила и заново правильно создайте тему.
 
Опции темы Поиск в этой теме
Старый 06.11.2015, 15:27   #1
Vzlom
Форумчанин
 
Регистрация: 11.02.2013
Сообщений: 155
По умолчанию [РЕШЕНО]: плавающий блок

Как сделать так, чтобы блок появлялся сразу после загрузки страницы, а не после прокрутки страницы.... Никак не получается это сделать

Код HTML:
<div class="floating">
   <!--Тут содержимое блока-->
  </div>
		<style>
	.floating {
 background: #B3C1B6;
 color: #fff;
 font: normal normal 14px Tahoma;
 padding: 20px;
 width: 165px; /*указываем ширину*/
}
.fixed {
 position: fixed;
   left: 1%;
 top: 1px; /*здесь указываем отступ сверху*/
 z-index: 9999; /*устанавливаем блок поверх всех элементов на странице*/
}
	</style>
		<script>
		$(function(){
 $(window).scroll(function() { 
  var top = $(document).scrollTop();
  if (top > -1) $('.floating').addClass('fixed'); //200 - это значение высоты прокрутки страницы для добавления класс
  else $('.floating').removeClass('fixed');
 });
});
		</script>	

Последний раз редактировалось Вадим Мошев; 10.11.2015 в 21:26.
Vzlom вне форума
Старый 06.11.2015, 15:53   #2
CodeNOT
Форумчанин
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
По умолчанию

Цитата:
Сообщение от Vzlom Посмотреть сообщение
Как сделать так, чтобы блок появлялся сразу после загрузки страницы, а не после прокрутки страницы.... Никак не получается это сделать

Код HTML:
<div class="floating">
   <!--Тут содержимое блока-->
  </div>
		<style>
	.floating {
 background: #B3C1B6;
 color: #fff;
 font: normal normal 14px Tahoma;
 padding: 20px;
 width: 165px; /*указываем ширину*/
}
.fixed {
 position: fixed;
   left: 1%;
 top: 1px; /*здесь указываем отступ сверху*/
 z-index: 9999; /*устанавливаем блок поверх всех элементов на странице*/
}
	</style>
		<script>
		$(function(){
 $(window).scroll(function() { 
  var top = $(document).scrollTop();
  if (top > -1) $('.floating').addClass('fixed'); //200 - это значение высоты прокрутки страницы для добавления класс
  else $('.floating').removeClass('fixed');
 });
});
		</script>	
это вот
Код:
$(window).scroll(function() { 
  var top = $(document).scrollTop();
  if (top > -1) $('.floating').addClass('fixed'); //200 - это значение высоты прокрутки страницы для добавления класс
  else $('.floating').removeClass('fixed');
 });
можно убрать и к блоку сразу поставить класс fixed если я правильно понял что вы хотите
CodeNOT вне форума
Старый 06.11.2015, 16:00   #3
Vzlom
Форумчанин
 
Регистрация: 11.02.2013
Сообщений: 155
По умолчанию

Цитата:
Сообщение от CodeNOT Посмотреть сообщение
это вот
Код:
$(window).scroll(function() { 
  var top = $(document).scrollTop();
  if (top > -1) $('.floating').addClass('fixed'); //200 - это значение высоты прокрутки страницы для добавления класс
  else $('.floating').removeClass('fixed');
 });
можно убрать и к блоку сразу поставить класс fixed если я правильно понял что вы хотите
не получается, имеено в этом коде нужно изменить что-то.
if (top > -1) - было 200 я сделал -1. Блок повялется и при исходном положении не пропадает. Но нужно сделать так, что бы он при загрузке страницы сразу появлялся, а не при проктуке вниз на 1 пиксель
Vzlom вне форума
Старый 06.11.2015, 16:04   #4
CodeNOT
Форумчанин
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
По умолчанию

если сразу, то пропишите ему просто класс
Код:
<div class="floating fixed">
   <!--Тут содержимое блока-->
  </div>
		<style>
	.floating {
 background: #B3C1B6;
 color: #fff;
 font: normal normal 14px Tahoma;
 padding: 20px;
 width: 165px; /*указываем ширину*/
}
.fixed {
 position: fixed;
   left: 1%;
 top: 1px; /*здесь указываем отступ сверху*/
 z-index: 9999; /*устанавливаем блок поверх всех элементов на странице*/
}
	</style>
CodeNOT вне форума
Старый 06.11.2015, 19:05   #5
Vzlom
Форумчанин
 
Регистрация: 11.02.2013
Сообщений: 155
По умолчанию

Каким образом это сделать?
Vzlom вне форума
Старый 07.11.2015, 10:30   #6
ADSoft
Старожил
 
Регистрация: 25.02.2007
Сообщений: 4,150
По умолчанию

а тема то - к html _ css относится... и ни буквой к php
ADSoft вне форума
Старый 07.11.2015, 17:17   #7
Vzlom
Форумчанин
 
Регистрация: 11.02.2013
Сообщений: 155
По умолчанию

Цитата:
Сообщение от ADSoft Посмотреть сообщение
а тема то - к html _ css относится... и ни буквой к php
PHP и другие серверные скрипты....Лучше бы подсказали, что - нибудь
Vzlom вне форума
Старый 09.11.2015, 15:50   #8
CodeNOT
Форумчанин
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
По умолчанию

Цитата:
Сообщение от Vzlom Посмотреть сообщение
Каким образом это сделать?
чел, я даже тебе написал, как блок выглядеть должен
Код:
<div class="floating fixed">
к блоку с классом floating добавляем класс fixed
CodeNOT вне форума
Старый 09.11.2015, 15:56   #9
ADSoft
Старожил
 
Регистрация: 25.02.2007
Сообщений: 4,150
По умолчанию

Цитата:
Сообщение от Vzlom Посмотреть сообщение
PHP и другие серверные скрипты....Лучше бы подсказали, что - нибудь
html и css не относятся ни к php, ни к другим серверным скриптам...
это средства разметки и отображения текста

я просто подсказал модерам - мол неплохо бы в другую тему перенести
ADSoft вне форума
Старый 10.11.2015, 12:13   #10
Vzlom
Форумчанин
 
Регистрация: 11.02.2013
Сообщений: 155
По умолчанию

Цитата:
Сообщение от CodeNOT Посмотреть сообщение
чел, я даже тебе написал, как блок выглядеть должен
Код:
<div class="floating fixed">
к блоку с классом floating добавляем класс fixed
Спасибо большое!!! Положительный голос тебедобавляю
Vzlom вне форума
Закрытая тема


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Плавающий круг 3AHO3A_DK Фриланс 6 17.06.2015 16:26
Плавающий блок на jquery Aleskandr Помощь студентам 0 19.03.2014 21:13
Плавающий слой wcp HTML и CSS 6 04.10.2010 20:08
Плавающий ткст bookkc Assembler - Ассемблер (FASM, MASM, WASM, NASM, GoASM, Gas, RosAsm, HLA) и не рекомендуем TASM 2 15.09.2010 15:19