Появление текста при наведении курсора.

[TyMaH]

Собственно, в overall_footer.html есть строчка <!-- IF DEBUG_OUTPUT -->{DEBUG_OUTPUT}<!-- ENDIF -->
Мне нужно чтоб она была "нивидима" ,но появлялась когда я навожу на нее курсор. Вопрос - Как такое сделать?
Спасибо!

[Sheer]

Покрасить ссылку под цвет фона.

[MIT]

Значение переменной {DEBUG_OUTPUT} — не ссылка. Но вариант с использованием псевдокласса :hover приемлим, если не брать во внимание древние браузеры. Как альтернатива — можно накидать пару строк, по работе с событиями мыши, на jQuery или другом фреймворке, если что-либо используется на форуме.

[TyMaH]

MIT , можете подробно расписать, что куда вставлять) заранее благодарен

[Alecto]

и я вставлю свои 5 копеек. где-то уже спрашивал, но ответа не получил.
подскажите, как установить задержку появления?
знаю, что надо ковырять onmouseover. пробовал вытянул из формы быстрого входа, но к сожалению для того-же выпадающего меню от Некстати у меня не заработало.

[MIT]

TyMaH, jQuery стоит?

[TyMaH]

мчат вроде от jquery работает, jquery.min.js вот такой у меня имеется если это то, значит стоит..

[MIT]

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

<div id="olololololo">text</div>

<script type="text/javascript">
// <![CDATA[
;(function($){$(function(){$('#olololololo').css('opacity','0').hover(function(){$(this).stop().animate({opacity:'1'},{duration:500});},function(){$(this).stop().animate({opacity:'0'},{duration:500});});});})(jQuery);
// ]]>
</script>

Вот, собственно, одна строчка кода, который делает эффект плавного появления и затухания элемента с идентификатором olololololo . Добавь идентификатор блоку с отладочной инфой, замени идентификатор в строчке кода и будет тебе счастье.

[Alecto]

MIT
красиво работает, но как его прикрутить к этой конструкции? чтобы менюшка в DIV появлялась с затуханием?

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

				<li class="icon-ucp">
					<a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e" style="display: block">{L_PROFILE}</a>
    					<div id="menu-1">
						<a href="link1">Ссылка 2</a>
						<a href="link2">Ссылка 2</a>
					</div>
				</li>

[TyMaH]

Эммм... немножко обнаглею.. т.к не понял как этим пользоваться...(точнее куда вставлять и что должно быть вместо olololo)
Можно инструкцию типа
открыть overallfooter.html
заменить на...
спасибо)

[MIT]

FomenkoAndrey
К чему именно ты хочешь прикрутить?

Если коротко — замени в JS селектор #olololololo на, например, .menu-1 a и тогда эффект будет применён ко всем элементам a внутри всех блоков с классом menu-1. В общем, селекторы аналогичны по написанию селекторам из CSS.

Что бы объекты не становились полностью прозрачными надо заменить 'opacity','0' и opacity:'0' на, например, 'opacity','0.5' и opacity:'0.5' соответственно.

TyMaH, потыкал бы сам для начала, поэкспериментировал, это ж интересно

[Alecto]

Через div реализованы выпадающие меню от Некстати: http://www.phpbbguru.net/kb/styling/dropdown-menu/

замени в JS селектор #olololololo

так и сделал, но тогда меню появляется при наведении на область DIV, а надо, что бы оно появлялось и исчезало с затуханием (или хотя бы задержкой) при наведении мыши на ссылку: <a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e" style="display: block">{L_PROFILE}</a>

Добавлено спустя 3 минуты 22 секунды:
TyMaH
могу предложить вот такой вариант:
найти что-то типа (может отличаться):

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

<!-- IF DEBUG_OUTPUT --> {DEBUG_OUTPUT}<!-- ENDIF -->

заменить на:

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

<!-- IF DEBUG_OUTPUT --><span id="olololololo"> {DEBUG_OUTPUT}</span><!-- ENDIF -->

<script type="text/javascript">
// <![CDATA[
;(function($){$(function(){$('#olololololo').css('opacity','0').hover(function(){$(this).stop().animate({opacity:'1'},{duration:500});},function(){$(this).stop().animate({opacity:'0'},{duration:500});});});})(jQuery);
// ]]>
</script>

да простит меня MIT за мои "5 копеек".

[TyMaH]

Вот оно че... спасибо )

[Alecto]

JS селектор #olololololo на, например, .menu-1 a

сделал и так - нет, не работает (((

[MIT]

FomenkoAndrey, что бы к подобному меню приделать такие эффекты, придётся писать костыли, ведь меню использует псевдокласс :hover и само (при помощи правил CSS) управляет моментом появления и скрытия блока ссылок. Плавное появление приделать не сложно:

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

<script type="text/javascript">
// <![CDATA[
;(function($){$(function(){$('.icon-ucp a[accesskey="e"]').hover(function(){$('#menu-1').stop().css('opacity','0').animate({opacity:'1'},{duration:500});},function(){});});})(jQuery);
// ]]>
</script>

а вот с затуханием сложнее...

сделал и так - нет, не работает

Угу, menu-1 — id, а не class, поэтому не .menu-1, а #menu-1.