We Keep Coding

How to make independent a function on different target jQuery?

I don't realy know if this is where the problem come from but it seems to be that the event of stopPropagation()is applying to both div at a time.
A bit of explanation : So I have a div ".customSelect" that display herself only if you click on a link ".custom-select".
The main problem is that when I told it to close it self if I click on the body, it open an other div (which has the same class but still shouldn't).
What is the best way to make them be independent ?
This is the code and here is a link to the Fiddle.
$('.custom-select').click(function(e){
e.stopPropagation();
$(this).next($('.customSelect')).toggle(350);
});
$('body').click(function(e){
$('.customSelect').toggle(350);
});
What am I doing wrong?

Use this to hide only the visible ones when you click away.
$('body').click(function(e){
$('.customSelect:visible').toggle(350);
});

How to detect scrolling in div when position is fixed

I am trying to detect scrolling in a div which is inside a div with position:fixed;.
This div with position fixed property is being added to DOM by javascript so i am attaching event handler like this
$(document).on('scroll', '.scroll_div', function(){
console.log("scrolled!");
});
But it is not working.

Try to use, everytime AFTER, when You add new .scroll_div element to DOM.
JSFiddle
$('.scroll_div').off('scroll').on('scroll', function(){
console.log("scrolled!");
});

jQuery scrollTop goes to the target then rolls up

I am using jQuery function scrollTop so when an element with a certain class is clicked your location changes. Here's what I have done:
$(document).ready(function (){
$(".paginacion").click(function() {
$(document).scrollTop( $("#galeria").offset().top );
});
});
I am navigating though a pagination menu which is in the middle of the page and I want to go back to that menu when I use the utility (clicking any element with the pagination class).
When I click any of those elements the page scrolls down for an instant but then scrolls back up.
What's wrong?

The <a> tag has a default href anchoring, which jumps to the target id and changes the URL hash/fragment. Just like #Khanh TO's example on the comment.
But if you are really wanting to handle this with jQuery. A good solution would be to first use preventDefault() which cancels the default execution on click event. Then switch to 'window' instead of 'document' when setting scrollTop. Both are going to have the same effect but $(window).scrollTop(value) is supported by all browsers.
$(".paginacion").click(function(e) {
e.preventDefault();
$(window).scrollTop( $("#galeria").offset().top );
});
If you are also looking to animate the scrolling, you just need to replace $(window).scrollTop() with:
$('html, body').animate({scrollTop: $("#galeria").offset().top});
FireFox and IE places the overflow at the html level so in order for animate(scrollTop) to work cross-browsers we need to include 'html'.
See this jsfiddle.

Opening the jquery UI dialog inside the div

I have a div#test , with which i bind a dblclick event to opens a jquery ui dialog, now i want to open
that dialog inside a floating div ( means a div whose position is absolute and placed on the
center of the screen) when the dblclick event triggers on div#test something like :
line #1 $("#test").trigger("dblclick"); => open the dialog
line #2 $("floatingdiv").html("I want to open the dialog inside
this div after executing the line #1);
Help me? Thanks.

First put test div inside floatingdiv.
$("#test .ui-dialog-content").bind("dialogopen", function() {
// Reposition dialog, 'this' refers to the element the even occurred on.
$(this).parent('div').css('position', 'relative');
});

How do I make this popup box disappear when I click outside?

http://jsfiddle.net/mnbayazit/by3zy/2/
I want the popup to disappear when I click somewhere on the background. Problem is, it disappears when I click an [X] or the popup itself.
Imagine it being a calendar-picker if that makes my intentions more clear.
How can I get it to do that?

Set a click handler for the body to remove your popup.
Set a click handler for the popup itself that calls stopPropagation() on the event, to prevent it from bubbling up to the body.
Roughly:
function showMyPopup(){
...
$(myPopupDiv).click(function(e){
e.stopPropagation();
});
}
function closeMyPopup(){
...
}
$(document.body).click(closeMyPopup);

The basic jist with this technique is to have a wrapping (or independent element layered with z-index) that 'captures' the click event, and hides the elements you desire. I've updated your fiddle with an example of how this would work, except imagine that the blanket element would have a height and width of 100% (to cover the entire viewport).