Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Daniel23

Tooltip Jquery

Recommended Posts

Olá a todos,

 

sou novo aqui e estou tendo dificuldade em resolver algo que aparentemente é simples, mas com ainda estou aprendendo jquery não estou conseguindo resolver

 

peguei esse script pra criar tooltips com jquery

 

function simple_tooltip(target_items, name){
$(target_items).each(function(i){
	$("body").append("<div class='"+name+"' id='"+name+i+"'><p>"+$(this).attr('title')+"</p></div>");
	var my_tooltip = $("#"+name+i);

	if($(this).attr("title")){ 

	$(this).removeAttr("title").mouseover(function(){
			my_tooltip.css({opacity:1.0, display:"none"}).fadeIn(300);
	}).mousemove(function(kmouse){
			my_tooltip.css({left:kmouse.pageX+25, top:kmouse.pageY+25});
	}).mouseout(function(){
			my_tooltip.fadeOut(300);
	});

	}

});

} 

$(document).ready(function(){
 simple_tooltip("a","tooltip");
});

 

o problema é o seguinte, quando não há um title definido ele retrona o valor undefined e gera a div com o undefined dentro

 

eu queria que quando não tivesse um title definido ele simplesmente não gerasse o div

 

agradeço que puder ajudar

 

valeu

Compartilhar este post


Link para o post
Compartilhar em outros sites

Troque

if($(this).attr("title"))

 

Por

if($(this).attr("title") != 'undefined')

 

Entendeu a modficação? Você pega o valor do title, e verifica se ele é diferente de undefined, caso seja, continua com o processo, caso contrário, ignora o elemento.

Compartilhar este post


Link para o post
Compartilhar em outros sites

eu tinha feito isso, mas ele continua retornando o valor undefined

 

tentei agora novamente pra ver se num era algum erro de digitação, mas continua retornando undefined

 

o que parece pra mim é que quando eu defino assim, ele não executa os efeitos da tooltip (mouseover, mouseout), mas continua gerando a div com "undefined" dentro

Compartilhar este post


Link para o post
Compartilhar em outros sites

Amigo.. você poderia passar mais alguns detalhes para ajudarmos..

 

por exemplo..

 

O que seria esse target itens??? Pergunto se tem algum padrão de title pro seu laço.. pois se tiver voce pode botar o each pra percorrer só os elementros com a atributo title prédeterminado.. pesquise por "seletores de atributo"

 

Por exemplo, vamos supor que voce quer percorrer ancoras ("<a>") q possuam o title nesse formato <a title="tooltip0" ...>, <a title="tooltip1" ...>, <a title="tooltip2" ...> etc..

 

entao seu codigo ficaria assim:

 

 

function simple_tooltip(target_items, name){
$("a[title *= 'tooltip']").each(function(i){
      (...)          
   });

} 

$(document).ready(function(){
        simple_tooltip("a","tooltip");
});

 

Dessa forma ele so vai correr nos "a's" com o padrao q você definir!!

 

Resumindo... :P

Coloca assim na chamada da sua função:

 

$(document).ready(function(){
 simple_tooltip("a[title *= 'seuPadrao']","tooltip");
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

esse é um script que estava disponível num site de Jquery, por isso não sei o porque do target_itens

 

é difícil interpretar o que quem desenvolveu quis fazer, por isso to com dificuldade em adaptar

 

o caso é que esse script pega todos os links com title e gera a tooltip usando estilo definidos no css, até ai ele funciona maravilhosamente, o problema é quando não tem title, ele gera a div com undefined que fica na parte de baixo do site distorcendo o layout

 

eu queria que quando não houvesse title ele não gerasse a div, isso porque a condição que ele colocou no script de verificar o title apenas impede que a tooltip funcione como tooltip, mas não que ela seja gerada

 

não há um padrão nas tooltips pra ser utilizado, ele deve pegar todos os links com title com algum conteúdo, só os vazios ou sem title e que ele não deveria gerar

 

a sua sugestão me deu uma idéia que infelizmente também não funcionou

 

$(document).ready(function(){
        simple_tooltip("a[title != '']","tooltip");
});

 

 

assim ele ignora os titles vazios, mas não resolve o problema de que ele continua gerando a div desses links...

 

ninguém tem idéia? já tentei de tudo aqui e sempre fica errado

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.