Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.10.2013, 18:52
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

fancybox смещение страницы вверх при клике по ссылке
При клике по ссылке class="fancybox" происходит прокрутка страницы на самый верх. Скрипт за исключением этой маленькой проблемы работает должным образом. Консоль FireBug не выдает никаких ошибок.

В интернете находил сообщения с описанием аналогичной проблемы, но к сожалению ответов не нашел.
Ответить с цитированием
  #2 (permalink)  
Старый 06.10.2013, 18:55
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

Нашел проблему, но не нашел решения.
В стилях использую html, body {height: 100%;} для того чтобы прижать подвал к низу окна браузера. Если данную строку убрать то прокрутки не происходит. Но как решить проблему не убирая нужные стили?
Ответить с цитированием
  #3 (permalink)  
Старый 06.10.2013, 19:29
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

body{height: 100%} - это зло. С html еще ок, но body должен принимать высоту всего содержимого, а не высоту окна. Изменяйте свой код прибивки подвала.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #4 (permalink)  
Старый 06.10.2013, 20:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,502

spo,
return false или event.preventDefault() хотя плагин fancybox должен сам отменять всплытие либо нарушена разметка html

Последний раз редактировалось рони, 06.10.2013 в 20:58.
Ответить с цитированием
  #5 (permalink)  
Старый 07.10.2013, 17:56
Аватар для spo
spo spo вне форума
Профессор
Отправить личное сообщение для spo Посмотреть профиль Найти все сообщения от spo
 
Регистрация: 11.05.2011
Сообщений: 213

danik.js, именно должен?
Странно, пользуюсь способом давно, способ самый распространенный среди верстальщиков, описан во многих статьях на многих ресурсах. Это конечно не о чем не говорит, но я никогда ничего подобного про body не слышал.
С чем связано такое правило и где о нем можно почитать?
Ответить с цитированием
  #6 (permalink)  
Старый 07.10.2013, 19:05
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

как же я мечтаю о CSS-правиле: {display: block-footer }
Ответить с цитированием
  #7 (permalink)  
Старый 07.10.2013, 20:19
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от spo
danik.js, именно должен?
Ну нет, не должен. И тогда возможны вот такие глюки как этот. Потому что по умолчанию все считают что body имеет высоту контента. Это помоему вполне очевидно и ожидаемо. Если верстальщик чего-то намудрил и в итоге body режется по высоте, то понятное дело могут возникать проблемы.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #8 (permalink)  
Старый 17.07.2014, 15:57
Аватар для Gurylyov
Новичок на форуме
Отправить личное сообщение для Gurylyov Посмотреть профиль Найти все сообщения от Gurylyov
 
Регистрация: 11.11.2011
Сообщений: 9

Если вдруг ещё не решили вопрос:
Решается вызовом фэнси с блоком прокрутки
$(".fancybox").fancybox({
        padding : 0,
	helpers: {
		overlay: {
			locked: false
		}
	}
});
Ответить с цитированием
  #9 (permalink)  
Старый 07.11.2014, 16:35
Новичок на форуме
Отправить личное сообщение для gradov81 Посмотреть профиль Найти все сообщения от gradov81
 
Регистрация: 07.11.2014
Сообщений: 4

Сообщение от Gurylyov Посмотреть сообщение
Если вдруг ещё не решили вопрос:
Решается вызовом фэнси с блоком прокрутки
$(".fancybox").fancybox({
        padding : 0,
	helpers: {
		overlay: {
			locked: false
		}
	}
});
У меня этот вариант решает проблему с вызовом первого изображения. Если нажать "Next" или "Prev" страница скролится вверх.
Как решить эту проблему, не знаете?
Ответить с цитированием
  #10 (permalink)  
Старый 07.11.2014, 16:43
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от BETEPAH
как же я мечтаю о CSS-правиле: {display: block-footer }
Я в последнее время использую примерно такие правила:

<style>
html, body{margin: 0; padding: 0}
body{
	/* stick footer to bottom */
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
main{
	background: yellow;
	/* stick footer to bottom */
	flex: 1;
	-ms-flex-preferred-size: auto; /* override autoprefixer */
}
footer{
	background: red;
	height: 50px;
}
</style>
<main></main>
<footer></footer>
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Увеличение картинки при клике - самый простой способ Lagshmivar Firefox/Mozilla 16 23.02.2017 16:03
Стрелка вниз на ссылке, при нажатии стрелка вверх Gasherez Общие вопросы Javascript 8 02.09.2013 23:34
Фиксация объекта при скрулинге страницы Pashok(one) Общие вопросы Javascript 10 08.01.2013 00:52
Изменить цвет при клике AndreyS jQuery 3 07.10.2012 15:27
Задача такова : нужно при клике на ссылку открыть страницу с новой вкладке, оставаясь asustekk Javascript под браузер 4 25.05.2012 13:04