Выпадающая форма входа (Dropdown login box)

[grishin]

Спасибо, форма центрируется по центру экрана...всё работает отлично...
Но всё таки хотелось бы что бы форма как на примере появлялась под кнопкой "Вход".

Заметил одну особенность..что форма исчезает если мышкой навести а потом убрать фокус с самой формы...в противном случае форма так и будет висеть открытой...может целесообразно сделать убирание формы спустя одну секунду если мышка не была наведена на форму вообще?

[Nekstati]

grishin, вот вам инструкция, относительно чистой установки мода, без учёта всех поправок, описанных в этой теме.

1. Очищаем ссылку «Вход» от всего, добавленного данным модом, и добавляем ей новый атрибут id="login-link". Ссылка должна иметь вид <a href="{U_LOGIN_LOGOUT}" id="login-link".

2. Добавляем следующий скрипт (для Просильвера — в файл forum_fn.js, а для Субсильвера — в overall_header.html перед строкой // ]]>).

Код: Выделить всё

window.onload = function() {
	var ql = document.getElementById('quick-login');
	var ll = document.getElementById('login-link');
	var delay1 = delay2 = delay3 = false;

	if (!ql || !ll) return;

	ql.style.left = ll.offsetLeft + 15 + 'px';

	ll.onmouseover = function() {
		delay1 = setTimeout(function() {ql.style.zIndex = 2}, 500);
		if (delay2) clearTimeout(delay2);
		if (delay3) clearTimeout(delay3);
	}
	ll.onmouseout = function() {
		delay3 = setTimeout(function() {ql.style.zIndex = -2}, 1000); 
		if (delay1) clearTimeout(delay1);
		if (delay2) clearTimeout(delay2);
	}

	ql.onmouseover = function() {
		if (delay2) clearTimeout(delay2);
		if (delay3) clearTimeout(delay3);
	}
	ql.onmouseout = function() {
		delay2 = setTimeout(function() {ql.style.zIndex = -2}, 1000);
	}
}

Теперь форма входа появляется через 500 мс после наведения курсора на ссылку «Вход», а исчезает через 1000 мс после ухода курсора с этой ссылки либо с самой формы. Положение формы по горизонтали привязано к положению ссылки «Вход»; если надо его скорректировать, ищите в скрипте число 15 и меняйте. Если кому-то такая привязка не нужна, удалите из скрипта строку ql.style.left = ll.offsetLeft + 15 + 'px';.

[grishin]

Сделал всё как написали:

Код: Выделить всё

<!-- IF not S_IS_BOT --><a href="{U_LOGIN_LOGOUT}" id="login-link">{L_LOGIN_LOGOUT}</a><!-- ENDIF -->

Добавил скрипт...

Вот что происходит при разрешении 1680:

d04f6866f2c6.jpg

Вот так при 1280:

0d05c9f727ee.jpg

Вот так при 1024 (если бы так было при всех разрешениях, то бы ло бы идеально):

b3391b4ac572.jpg

Добавлено спустя 1 минуту 7 секунд:
Форма исчезает отлично, даже если мышку не наводил на неё)

[Nekstati]

Это потому что у вас ограничена ширина стиля. Замените строчку

Код: Выделить всё

	ql.style.left = ll.offsetLeft + 15 + 'px';

на

Код: Выделить всё

	ql.style.left = ll.offsetLeft + 15 + (document.body.offsetWidth > 1200 ? ((document.body.offsetWidth - 1200) / 2) : '') + 'px';

[grishin]

Спасибо большое что помогаете.
Всё работает отлично теперь, но заметил один баг (или может я корявлю и придираюсь просто)
Монитор разрешение 1680 обновляю страницу (с последними правками), и всё идеально выходит, сжимаю окно браузера допустим до 1280 (без перезагрузки страницы) и форма съезжает, обновляю в таком разрешение страницу и навожу мышку на "Вход" всё работает идеально....И так каждый раз при изменении разрешения без обновления..

Сори что отвлекаю такой ерундой ..

[Nekstati]

Ну истесно. Скрипт определяет позицию ссылки и ширину окна один раз, при загрузке. Так обычно и делается, чтобы не писать лишние функции. Добавьте ещё это, ежели оно вам надо:

Код: Выделить всё

window.onresize = function() {
	var ql = document.getElementById('quick-login');
	var ll = document.getElementById('login-link');
	if (!ql || !ll) return;
	ql.style.left = ll.offsetLeft + 15 + (document.body.offsetWidth > 1200 ? ((document.body.offsetWidth - 1200) / 2) : '') + 'px';
}

[grishin]

А оно мне надо? вот в чём вопрос))))
Это сильно повлияет на нагрузку сервера или страница будет на много дольше грузиться? или есть ещё какие то причины не делать этого?))

ПС извиняюсь конечно)) но при наведении на кнопки в форме появляется ссылка на сайт http://f_orex-mmci_s-film.ru/ это так и задумано или я что то пропустил

Добавлено спустя 4 минуты 43 секунды:
Всё работает теперь отлично у меня..ПРИМНОГО благодарен.
ПС теперь при наведении мышкой на кнопки появляется другая подсказка...не понял от куда....у Пчелкина то ссылка на сайт появляется в этой форме))

[Nekstati]

Интересная ссылка. У вас случаем не завелись вирусы? Я вот тоже вам дам интересную ссылку. http://www.freedrweb.com/cureit/?lng=ru

[Пчелкин]

Ложу 1000 р на тф ,тому кто вмурует по этому же принципу Javascript Logout Confirmation..
Я серьезно...взято здесь... http://www.phpbb.com/community/viewtopic.php?t=712845

[grishin]

Самому странно...то ссылка была левая при наведении на кнопки, потом текст какой то, щас size=85...не пойму что то...а у вас на сайте пчёлкина http://fotovideoforum.ru/index.php при наведении на кнопки вход и отправить какая подсказка выплывает????

Ответьте пожалуйста, а то начал сомневаться))) ставить на форум или нет)))
Это сильно повлияет на нагрузку сервера или страница будет на много дольше грузиться? или есть ещё какие то причины не делать этого?))

[Пчелкин]

Ничего не выплывает..все чисто..Я Каспера обожаю, просто влюблен по уши.Даже иногда балдею от него, принимаю вместо горилки (2011 интернетсекорите)

Добавлено спустя 2 минуты 26 секунд:

или страница будет на много дольше грузиться

Чего б она долго грузилась? Один раз в кеш браузера скрипт влетит и все...

[grishin]

....ну вот накосячил где то....
При входе на страницу регистрации появилась широкая белая полоса в самом низу страницы

17e648a9f263.jpg

И на локалке так и на рабочем форуме...http://www.volley-tambov.ru/forum/ucp.php?mode=login
Как исправить подскажите?(

[Пчелкин]

Как вариант : При внесении изменений в файлы влетела и попытка внесения ссылки от вирусняка...точно..

Добавлено спустя 3 минуты 54 секунды:

Код: Выделить всё

</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-16305685-1");
pageTracker._trackPageview();
} catch(err) {}</script>

Это что?

Добавлено спустя 2 минуты 1 секунду:
Это кусок от мода Linked Profile Picture - Hidden parts? Чего он там делает?

[grishin]

виной белого фона было в stylesheet.css

Код: Выделить всё

html {
	background-color: #FFFFFF;
}

Удалил и вроде нормально стало.

Пчёлкин а в каком файле это нашлось????
Всё всегда делаю строго по инструкции

[Пчелкин]

Это из HTML кода страницы, которую вы указали..А уж из чего она состоит - ваша проблемма.