Създавам скрита форма за контакт, която ще се появи, когато мишката е позиционирана над елемента. Това е доста просто и аз го постигнах, като направих:
$(document).ready(function(){
$(function (){
$("#contact_1").hover(
function(){ $(this).stop(true,false).animate({right: 0}, 500); },
function(){ $(this).stop(true,false).animate({right: -218}, 500); });
});
});
Сега проблемът е, че когато потребителят премине през елементите за въвеждане или текстовото поле и започне да пише своите подробности, той може да премести мишката извън контейнера (много вероятно да го направят).
Как мога да предотвратя скриването на формуляра в този случай?
Предполагам, че добавя някои условни функции (if/else) в рамките на функциите за задържане, но как мога да получа текущата позиция на текстовия курсор?
Формата за контакт (#contact_1
) съдържа 4 елемента в ID: #cf_name
, #cf_email
, #cf_phone
, #cf_text
Моля, обърнете внимание: Искам да избегна потребителите да кликват върху бутон за показване/скриване
*може да е просто запитване, но никъде не мога да намеря ясен отговор.
------------------------------
РЕШЕНИЕ:
Благодарение на помощта на Diodeus по-долу успях да го разреша така:
Всеки вход има onfocus
/onblur
действия:
<input type="text" id="cf_name" class="text" name="name" onfocus="allowcfhide=false;" onblur="allowcfhide=true;" />
Ховър скриптът беше променен:
var allowcfhide=true;
$(document).ready(function(){
$(function (){
$("#contact_1").hover(
function(){ if (allowcfhide) $(this).stop(true,false).animate({right: 0}, 500); },
function(){ if (allowcfhide) $(this).stop(true,false).animate({right: -218}, 500); });
});
});