there are several reasons this isn't working , the main reason is
everything you click on is in the body,including the div you want to
stay open. Events bubble up from children to parent. Even though you
think you are only clicking on your div, you are also clicking body. Try
this in firebug on any page that has jquery loaded
$('*').click(function(){
alert(this.tagName);
});
you can see the bubbling up of all tag's parents all the way to html tag
as alerts will keep going off for each parent
you will need a filter on your body click to stop your div closing
something like:
$('body').click(function(event){
if ($(event.target).is(".menu-cnts *")) {
///do nothing
}
else{ $('#' + divDados).hide();}
});
that will stop your div closing, as for the rest of your method there
are other issues there too:
$(element).click(function(){ //why use an <a> tag?
$('#' + divDados).hide();/// why hide the div you want to open?
$(this).next().show(); // you created methods to identify your div by
ID, but this is opening it ...your div is the next inline element to the
<a>tag
//
return false;
});
I think you are trying to use this to open another div from another link
but it sure seems you will have a much easier time using other methods
than working with ID's
you could add/remove classes such as class="hidden" and css .hidden{
display:none}
or something like:
find("yourDivClass:visible").hide();// if you only intend to have one
open at a time this would be easier than ID's
you might consider scrapping out all the css parameters, work outside
the plugin with real classes and ID's in your functions to get them
working first then put them into the plugin after you know your methods work
http://jsbin.com/ekaqe
First click Euro (€), then a div shows up, the first problem is that
if you click on the div, the div closes itself, and the other problem
is, if you have 2 links to open divs they don't close itself, i need
to click on the document page to close them
Here is the JS:
jQuery.fn.DivMenu = function(opcoes){
/**
* Valores de defeito.
**/
var variaveis = {
'display' : 'none',
'position' : 'absolute',
'background' : '#fff',
'border' : '1px solid #cecece',
'font-family' : 'Verdana, Arial, Helvetica, sans-serif',
'font-size' : '11px; padding: 5px; z-index: 999999'
};
var opcoes = $.extend({}, variaveis, opcoes);
/** end **/
/**
*
**/
return this.each(function(){
/**
* Declarar variaveis.
**/
var element = this;
var offset = $(element).offset();
var left = offset.left;
var top = offset.top;
var currentId = $(this).attr('id');
var divDados = currentId + '-dados';
/** end **/
/**
*
**/
$(element).click(function(){ $('#' + divDados).hide();
$(this).next
().show(); return false; });
$(document.body).click(function(){ $('#' + divDados).hide(); });
/** end **/
/**
*
**/
$('#' + divDados).css({
'left' : left + 'px',
'top' : top + 15 + 'px',
'display' : opcoes['display'],
'position' : opcoes['position'],
'background' : opcoes['background'],
'border' : opcoes['border'],
'font-family' : opcoes['font-family'],
'font-size' : opcoes['font_size']
});
/** end **/
});
/** end **/
};
On 13 Jun, 14:42, Charlie <charlie...@gmail.com> wrote:
get better response with a link to see the problem, jsbin works great , has
built in script libraries including jquery
Glazz wrote:nobody can help me out?
