i want create a focus on location "Molise, italy" when load a SVG map in my page http://goo.gl/0ZywjM
so i have created this simple script in jquery
<script>
jQuery('#path20684').click();
</script>
it work , but only after load the page and after insert this from chrome console , if insert this on footer not work because the svg file it not part of dom. how i can solve this, or have other solution ?
update it work only with this:
window.setInterval(function(){
jQuery('#path20684').click();
}, 1000);
but with this every second is clicked , so i think the problem is the script start before a SVG file is loaded, how solve ?
http://jsfiddle.net/CYhgZ/90/
please check the above link for demo
$(function() {
// when click event happens below code executed
$('path').on('click', function() {
alert("clicked")
});
//simulating click event automatically when page load
$('path').trigger("click");
//or
//$('path').click();
});
Related
I'm trying to use a script called Socialite in my Wordpress site to make social share buttons appear only after the user has moved his/her mouse AND the document already loaded.
I can't get it to work together. My current script, that does work, is:
jQuery(document).one("mousemove", function() {
var social_container = jQuery('.social_buttons');
Socialite.load(social_container);
});
But how do I connect the document load part?
Thanks
Have you tried to put your code into
jQuery(document).ready(function(){/* your code goes here*/});
?
For starters you have a small typo in the first line
jQuery(document).one("mousemove", function() {
You're calling .one("mous...
It should be .on("mous...
Next considerations is that the document ready statement below will happen before images etc have loaded
$(document).ready(function(){
// your code goes here.....
});
using a window load statement like below waits until everything i.e.images have loaded in full
$(window).load(function(){
// code here.....
});
I'm not sure what would suit your needs best as I have no experience with Socialite but hopefully this will give you the answers you need.
I have an API which works appending the fancybox script to the head tag of the client's web page, but obviously this happens after the dom is ready, so the init function of fancybox is not called
In fancybox.js:
$(document).ready(function() {
$.fancybox.init();
});
I've tried changing it to :
$(document).bind('ready', function() {
$.fancybox.init();
});
and then triggering the dom ready function in different ways (one by one):
$(document).trigger("ready");
$().trigger("ready")
$().ready();
I've also tried calling the init function when the script is loaded:
$.fancybox.init();
Nothing seems to work.
I'm sure that the fancybox.css, the fancybox.js and even mousewheel.js and easing.js are loaded in the documment before trying all that, I also added a timeout to be sure.
So the question is, how can the fancybox plugin be initialized after appending the js to the head tag?
I don't think you need to call $.fancybox.init(); but just initialize the proper selector after the fancybox script has been loaded so I would try within the API something like :
if (!jQuery.fn.fancybox){
// fancybox is not loaded
jQuery.getScript("{path}/jquery.fancybox.js"); // you may need to change the path
setTimeout(function(){
// init fancybox selector
jQuery(".selector").fancybox();
}, 100); // delay selector initialization
} else {
// fancybox script is ready so initialize (re-init) selector
jQuery(".selector").fancybox();
};
I am currently writing some Javascript code that adds some tags across text in an HTML file after the page loads. I use the
window.onload
method for achieving this.
However, I am facing an issue in pages like google plus, where you get more content as you scroll down. Is there a way of calling my JS function when such a page adds more content?
Thanks
Akshay
There are several ways how to get this working. You can either use jquery like this:
$('#mydiv').bind("DOMSubtreeModified",function(){
// your code goes here
alert('changed');
});
Note that this is not supported in IE8( and below).
Or you can run loop and continuously fire the desired code:
var interval = setInterval(function() {
// your code goes here
}, 1000);
Fiddle: http://jsfiddle.net/8RF5r/5/
I have downloaded a Tree View Code and it is working fine. The code is in this way :
d = new dTree('d');
d.add(0,-1,'StratApps');
d.add(1,0,'First Folder','example.html');
d.add(2,1,'Packages','example1.html');
d.add(3,2,'Pkg_Load_Dim','example2.html');
d.add(4,2,'Pkg_Write_to_File','#');
d.add(5,1,'Interfaces','#');
d.add(6,5,'Int_Load_Order_Dim','#');
d.add(7,5,'Int_Load_Channel_Dim','#');
d.add(8,1,'Procedures','#');
d.add(9,8,'Proc_Update_Order','#');
d.add(10,8,'Proc_Process_Errors','#');
document.write(d);
Now I want to give the links to open respective Divs in the right-side. Can anyone help me in this regard...
You could try something along these lines:
$('.dtree a.node').prop('onclick', '').click(function(e) {
var href = $(this).prop('href');
$('#divOnRightSide').load(href);
e.preventDefault();
});
Basically, what you say is: for every node (i.e. link) there is in every dtree on the page, remove the onClick-event directly from the HTML and add a click event handler.
In this handler, get the href-attr, and load the content of that link into the div with id="divOnRightSide".
Then, so no page navigation is triggered, use e.preventDefault().
Hope this helps.
EDIT:
Here is a jsFiddle to demonstrate the purpose: jsFiddle.
This is my code posted in a jsfiddle Demo.
As you can see when you click on the
Hyderabad.
Visakhapatnam.
Then a Horizontal Image slider is shown ( YOu can slide throgh the Pictures )
Now my requirement is I need to also show the Image slider on body load itself also
I have tried using body onload function to show the div , and also in Jquery ready function , and by commenting all the hide() functions in javascript , but none of them really worked .
Could anybody please tell me what is the way to do this .
I just tested it.. first I thought that you should just do this:
jQuery(document).ready(function() {
$fp_galleries.first().click();
});
but poorly this will only show the first image and not all images.
I don't know why but it looks like you should do this.
$(window).load(function() {
/* your code */
$fp_galleries.first().click();
});
Maybe because you need to wait until the images are loaded.
perhaps use document on ready to call the function: http://api.jquery.com/ready/
$(document).ready(function() {
openGallery(galleryname){
})
;
The problem is not that it is hidden, its rather that the content are only generated by som javascript when the user clicks one of your links.
You could add something like
$("li",$fp_galleries).first().click()
at the bottom of your script.
This will trigger the click event on one of the links.