We Keep Coding

Toggle divs automatically closes

I am using toggle functionality and it seems that the toggle button is self closing without a reason. It appears and it closes straight after. The code I am using is very simple:
(function($) {
$(document).on("tap", ".Hide-1", function () {
$(".div-1").hide("slow");
});
$(document).on("tap", ".Reply-open-button-1", function () {
$("div.Reply-div-1").toggle("slow");
$("div.Alert-div-1").hide("slow");
$("div.Close-div-1").hide("slow");
});
$(document).on("tap", ".Alert-open-button-1", function () {
$("div.Alert-div-1").toggle("slow");
$("div.Reply-div-1").hide("slow");
$("div.Close-div-1").hide("slow");
});
$(document).on("tap", ".Close-open-button-1", function () {
$("div.Close-div-1").toggle("slow");
$("div.Reply-div-1").hide("slow");
$("div.Alert-div-1").hide("slow");
});
})(jQuery);
I am also using 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'
Can you see any potential reason why would it self close when I tap on any of them?
Thanks in advance N!

Adding jQuery code to wordpress

I am trying to add the following code to Wordpress but it doesn't seem to work. The same code in a fiddle works.
Please help.
$(".box").hover(
function (e) {
$('.box').not(this).addClass('grey')
}, // over
function (e) {
$('.box').removeClass('grey')
} // out
);

You have to wrap it in the noConflict mode. Like:
jQuery(function($){
// Your jQuery code here, using the $
});
See: http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/
So, that would boil down to
jQuery(function($){
$(".box").hover( function (e) {
$('.box').not(this).addClass('grey');
}, // over
function (e) {
$('.box').removeClass('grey');
} // out
);
});

Refresh parent page after closing modal

When a user opens this modal, they can see their shopping cart information and delete items(other jquery) on the modal.
But how could I refresh the parent page after a user closes up the modal?
I read several posts but did not find any useful information for my situation. I know I need to use something like window.location.reload(true); Where should I put that in the code?
$(function(){
$('#main').off('click.login').on('click.login',function(){
$('body').loadmodal({
id:'cart',
title:'Shopping Cart',
url:'/cartDisplay/',
width: '550px',
});
});
});
Update
$(function(){
$('#main').off('click.login').on('click.login',function(){
$('body').loadmodal({
id:'cart',
title:'Shopping Cart',
url:'/polls/cartDisplay/',
width: '550px',
});
});
$('#cart').on('hidden', function () {
window.location.reload(true);
})
});

Try this.
$("#cart").on('hide', function () {
window.location.reload();
});

I assume that you are using Twitter Bootstrap
Bootstrap 3
$('#cart').on('hidden.bs.modal', function () {
window.location.reload(true);
})
Bootstrap 2.3.2
$('#cart').on('hidden', function () {
window.location.reload(true);
})

As far as I can tell, jquery.loadmodal.js has bootstrap.js as a dependency, so its modals are still subject to bootstrap's methods.
In that case, you can simply bind to hidden.bs.modal
...
$('#yourModal').on('hidden.bs.modal', function () {
location.reload();
});
...

Where you open the nyroModal window, just add this callback function:
callbacks: {
afterClose: function() {
window.location.reload();
}
}

Using $(function () Versus using $(document).ready(function () {

i have implemented a java script to bounce an image on my asp.net mvc 3 web application, if i write the Jscript as follow it will work fine:-
$(document).ready(function () {
$("#to-get-bigger").mouseover(function () {
$(this).effect("bounce);
});
});
but if i write it this way it will not work !! ,, so what might be the reason behind this :-
$(function () {
$("to-get-bigger").mouseover(function () {
$(this).effect("bounce");
});
});

You are missing the hash # for your selector. I've fixed it:
$(function () {
$("#to-get-bigger").mouseover(function () {
$(this).effect("bounce");
});
});

You forgot the # in front of "to-get-bigger".
It's a typo.

Timer Reset Function Not Working!

Hello Guys!
I have been trying to create a simple sample code for my newest jQuery Plugin, but it doesn't seems to be working at all! Can anyone tell where I'm going wrong?, or can anyone provide me a new function to do it. So my problem is that when I mouse over an element classed trigger an another element classed eg should fadeIn(); but if the user takes out the mouse before the element classed eg fades in it should not be fading in anymore, but this is not working at all. I don't not what is getting wrong? Please help me out. (Below is my Problem HTML nad Jquery Code!)
HTML CODE
<div class="trigger">MouseOverMe</div>
<div class="eg">See Me!</div>
JQUERY CODE
function timereset(a)
{
var elem = $('.'+a);
if(elem.data('delay')) { clearTimeout(elem.data('delay')); }
}
$(document).ready(function () {
$('div.eg').hide();
$('div.trigger').mouseover(function () {
$('div.eg').delay(1000).fadeIn();
});
$('div.trigger').mouseout(function () {
timereset('eg');
$('div.eg').fadeOut();
});
});
THANKS IN ADVANCE

You don't need that timereset stuff, simply call stop() on the object and the previous effect will stop:
http://api.jquery.com/stop/
Update based on the new comment:
$('div.trigger').mouseout(function () {
$('div.eg').stop().hide();
});

jQuery
$('.trigger').hover(function() {
$('.eg').delay(1000).fadeIn();
}, function() {
$('.eg').stop(true, true).hide();
});
Fiddle: http://jsfiddle.net/UJBjg/1

Another option would be to clear the queued functions like:
$('div.trigger').mouseout(function () {
$('div.eg').queue('fx', []);
$('div.eg').fadeOut();
});
Bear in mind if the fadeOut/In has already started by using stop you could end up with a semi-transparent element.
EDIT
Here's an example: http://jsfiddle.net/Qchqc/

var timer = -1;
$(document).ready(function () {
$('div.eg').hide();
$('div.trigger').mouseover(function () {
timer = window.setTimeout("$('div.eg').fadeIn(function() { timer = -1; });",1000);
});
$('div.trigger').mouseout(function () {
if(timer != -1)
window.clearTimeout(timer);
$('div.eg').fadeOut();
});
});