We Keep Coding

JQuery Reload div data Only

I am new to JQuery and facing an issue while refreshing div using following script
< script >
$(document).ready(
function() {
setInterval(function() {
$("#dbq").load("dbqtest.php");
}, 10000); //Delay here = 10 sec
});
</script>
<?php
echo '<section class="col-lg-6" id="dbq">';
echo '<p>My Section </p>';
echo '</section>';
?>
The section i am trying to refresh is declared as below
The problem i am facing is that whenever the page loads for the first time, table from "dbqtest.php" is not visible for 1st 10 seconds. and My section stays there even after loading data from "dbqtest.php"

You need a wrapper for reloading section. Somthing like this must work:
<script>
$(document).ready(
function() {
setInterval(function() {
$("#dbq-wrapper").load("dbqtest.php");
}, 10000); //Delay here = 10 sec
});
</script>
And the HTML:
<div id="dbq-wrapper">
<section class="col-lg-6" id="dbq">
<p>My Section </p>
</section>
</div>
Hoever you can use div inside section and reload data to that and use section as parent, anyway you need wrapper.
As you want to the first time load without delay, the solution is somthing like this:
< script >
function dbqLoader {
$("#dbq").load("dbqtest.php");
}
$(document).ready(function() {
dbqLoader(); // for first time.
function() {
setInterval(function() {dbqLoader();}, 10000); // Loop with Delay
});
});
</script>

This has to be it:
<script>
$(document).ready(function() {
$("#dbq").load("dbqtest.php");
setInterval(function() {
$("#dbq").load("dbqtest.php");
}, 10000);
});
</script>
It's very similar to M.Abooali's answer but I've fixed some issues and minimised it.

Load a jsp page every 20 secs after 1st page load

I am trying to autosubmit a form upon 1st load and then refresh every 20 secs. I have tried below but it keeps loading the page all the time. is that correct implementation or how I can achieve that.
window.onload=function(){
var auto = setTimeout(function(){ submitform(); }, 100);
function submitform(){
document.forms["frm1"].submit();
}
function autoRefresh(){
clearTimeout(auto);
auto = setTimeout(function(){ autoRefresh(); }, 20000);
}
}

You must use setInterval() instead :
setInterval(function(){
//Refresh code here
//location.reload();
}, 20000);
So the code inside will be triggered every 20 second.

Timing fancybox popup

I have a popup window using fancybox which I would like to add some timings to, show after 1 second maybe and disappear after 5. I cant figure out where to add any delays in the code i am using, please can anyone help?
<script type="text/javascript">
jQuery(document).ready(function ($popup) {
$popup("#hidden_link").fancybox({
onComplete: function () {
$popup("#fancybox-img").wrap($popup("<a />", {
href: "mylink.html",
target: "_blank",
// delay: 9000 would like a delay ideally
}));
}
}).trigger("click");
});
</script>
<a id="hidden_link" href="images/myimage.jpg" style="visibility:hidden;"></a>

You can use $.fancybox.open(), see details here - Can you explain $.fancybox.open( [group], [options] ) params and if I can add youtube link as href?, and $.fancybox.close().
setTimeout(function(){
$.fancybox.open(...)
}, 1000);
setTimeout(function(){
$.fancybox.close(...)
}, 5000);

If your link is not going to be visible, you may rather open fancybox programmatically using the $.fancybox.open() method and close it using the $.fancybox.close() method.
As pointed out, you could use setTimeout() to delay the execution of either those methods like :
jQuery(document).ready(function ($popup) {
// open with delay
setTimeout(function () {
$popup.fancybox({
href: 'images/image01.jpg',
onComplete: function () {
$popup("#fancybox-img").wrap($popup("<a />", {
href: "mylink.html",
target: "_blank"
}));
// close with delay
setTimeout(function () {
$popup.fancybox.close();
}, 9000); // setTimeout close
}
});
}, 2000); // setTimeout open
}); // ready
See JSFIDDLE
Note: this is for fancybox v1.3.4.

show div after 5 seconds and then refresh the div every 1 min

I have created a div into my page which i wanted to get load after 5 seconds the page get load. Then I wanted to refresh the div without refreshing the page after every 1 min. How can I achieve this functionality with the use of J query. My code look like this
$(document).ready(
function () {
setInterval(function() {
$('#newsletter').show();
}, 100000);
});
This upper block of code is only refreshing the div after 1 min. But on page load , i want the div to be shown to the user after 5 seconds and then this block of code should executed.

$(document).ready(function()
{
setTimeout(function()
{
// Perform actions you need to
setInterval(function()
{
// Perform them again every minute
}, 60000);
}, 5000);
});
I think what you were looking for is setTimeout

Try it:
$(function(){
setTimeout(function(){
$('#newsletter').show(); // to show div after 5 sec of page load
// To reshow on every one minute
setInterval(function() {
$('#newsletter').show();
}, 60000);
}, 5000);
});

You've already got the base functionality there, so all you'll need to do is add a message to appear after 5 seconds. Something like this should work.
$(document).ready(function()
{
setTimeout(function() {
// show message
},5000);
setInterval(function() {
$('#newsletter').show();
}, 60000);
});

Here is a jQuery solution:
$(document).ready(function () {
var $newsletter = $('#newsletter')
.delay(5000)
.show(function() {
setInterval(function() {
// update the newsletter, e.g. set new text
$newsletter.text(new Date());
}, 60000);
});
});

Second div to autoplayed always 1 sec after the first div

My question is how can I have #slider to be played always 1 second after #faded. Having it in 4 secs and 5 secs is not a stable way.
$(function(){
$("#faded").faded({
autoplay: 4000
});
});
$(function(){
$("#slider").faded({
autoplay: 5000
});
});

Is this what you want / need? It will fade in the first element after 4 seconds and when that is done, it will trigger a second timer after 1 second:
setTimeout(function() {
$('#faded').fadeIn('normal', function() {
setTimeout(function() {
$('#slider').fadeIn('normal');
}, 1000);
});
}, 4000);

Here is one problem you are facing:
$(function(){... this event happens before the page is render, thus creating inconsistencies in your code.
I would recommend that you change it to window.onload = function (){....
this should fix the problem.