[英]How to hide a tooltip?
I'm working on website using CRM (drupal) and the tooltip for mobile i don't know how to hide it when i click on it again this is the website http://www.cfb.it in the section of servizi the tooltip work fine for the desktop, but when I try to access the website from the phone (I tried iphone and samsung) and click on it, the tooltip appear but I cannot hide it back again once I click it's stay. 我正在使用CRM(drupal)和移动工具提示在网站上工作,当我再次单击它时,我不知道该如何隐藏它,这是servizi网站中的网站http://www.cfb.it工具提示在桌面上可以正常工作,但是当我尝试通过电话(尝试使用iphone和三星)访问网站并单击它时,会显示工具提示,但是单击后就无法再次隐藏它。
Here is the jquery code for this tooltip, I don't know what is missing. 这是此工具提示的jQuery代码,我不知道缺少什么。
(function($) {
$(document).ready(function() {
function tooltipInit() {
var tooltip = jQuery('.tooltip'),
target = jQuery('.icon'),
arrow = jQuery('.arrow-down'),
mobile = jQuery(window).width() < 960,
desktop = jQuery(window).width() > 960
if (mobile) {
jQuery(".overview:odd").addClass('pull-left');
target.click(function() {
target.css({
"background-position": "top"
});
jQuery(this).css({
"background-position": "bottom"
});
tooltip.removeClass('visible');
arrow.removeClass('visible');
jQuery(this).siblings('.tooltip, .arrow-down, .details').addClass('visible');
$this = $(this);
$this.parents('.icons').find('.details').removeClass('mobile-show');
$this.find('.details').addClass('mobile-show');
});
tooltip.click(function() {
jQuery(this).removeClass('visible');
jQuery(this).siblings('.arrow-down').removeClass('visible');
jQuery(this).siblings('.icon').css({
"background-position": "top"
});
});
target.unbind('mouseenter');
target.unbind('mouseleave');
}
if (desktop) {
jQuery('.pull-left').removeClass('pull-left');
target.css({
"background-position": "top"
})
tooltip.removeClass('visible');
arrow.removeClass('visible');
target.bind('mouseenter', function() {
jQuery(this).siblings('.tooltip, .arrow-down').addClass('visible');
jQuery(this).css({
"background-position": "bottom"
});
var removeTooltip = function() {
tooltip.removeClass('visible');
arrow.removeClass('visible');
};
target.bind('mouseleave', removeTooltip);
target.bind('mouseleave', function() {
jQuery(this).css({
"background-position": "top"
});
});
});
}
}
jQuery(window).on("resize", tooltipInit);
jQuery(document).on("ready", tooltipInit);
This tooltip is similar to this one in this website http://visia.themes.tf/ I will appreciate your help please 此工具提示与此网站http://visia.themes.tf/中的该工具提示相似,请多谢您的帮助。
Hello Please use below code to track if devide is mobile device or not then execute your code 您好,请使用以下代码跟踪devide是否为移动设备,然后执行您的代码
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
// some code..
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.