I am creating a jQuery plugin which requires another external library (Google Maps in particular).
I would rather not have to add the Google maps script (i.e. <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>) to my head section, but have the plugin do so. However, if for what ever reason the page already has the google maps JS on it, I don't want the plugin to duplicate it.
Possible? If so, how? Thanks
Related
I am currently using GTM to render all external scripts. I have successfully done that with Analytics and Adwords scripts. GTM renders them in footer.
However, google adword phone number tracking script requires to be placed in between head tags only. I am wondering if it possible via GTM. I am trying to do it by using 'Custom HTML tag' in GTM.
Since GTM still doesn't support AdWords call tracking skript from the box, it's easy to do yor own implementation, just add it as Custom HTML Tag and be sure to check Support document.write
See for example this solution
I'm trying to follow the AMP guidelines suggested by Google (ampproject.org)
but as soon as I add their js script, the jQuery scroll stops working
Does anybody knows why and how to fix it?
The script tag is prohibited in AMP HTML unless:
The type is application/ld+json
It is the mandatory script tag to load the AMP runtime
It is a tag to load extended components
https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md#html-tags
A list of available extensions, such as amp-carousel, can be found here.
You can also use custom elements and web components according to this page.
"AMP components may have JavaScript under the hood, but it is
coordinated with other AMP components, so its composition into the
page doesn’t cause performance degradation."
The only way to include JQuery scroll is to pull it in via an AMP-IFRAME tag. But that will only give you access to it within the context of the amp-iframe so most likely that will not help you. What are you trying to accomplish with the JQuery scroll? AMP pages are meant to be simple and for displaying information very quickly. Best examples for the use of AMP pages are news sites. If you open CHROME debugger and click on the mobile view icon and then do a search for say "Trump", you'll see the carousel of AMP pages at the top. You'll notice that they are all simple news stories. Nothing to fancy.
Do you have an example of what you are trying to do that we can look at?
Is it possible to embed google map with custom markers to a website just by iframe? I have google map on my website with markers and everything is working with some functions in javascript. It's okay but now I want to enable some users to add same map with same markers to their website. I want to do it very easy and with less code possible. So I want to give code to users that they add to site and everything would work. Is it possible with just iframe tag? Or I must give users code in javascript too? Or is there another way? Thanks
You may use Mapsengine to create the map, they may easily be shared via iframe. But there is no option to apply custom script-code.
Another approach: use a script-file that contains the code used with the map and that also creates the map. The users may embed this script instead of an iframe, the sharing would be as simple as when you would use an iframe.
I would like to inject, via a bookmarklet, my own code into a web page.
That code needs jQuery, jQuery UI and some plugins to be added too in the web page.
I read about noConflict but what about if some jQuery plugins (with different version) are also loaded by the web page and they uses the same CSS class names or ids.
how must I proceed to inject all my code?
What kind of bookmarklet are you trying to inject. If you can open an iframe using your bookmarklet and show your content there like RTM, Springpad etc then I believe you won't have a problem.
I have a fairly long page with sections such as Google Maps, image slider, Google ads, BrightCove video (optional) and images. Loads nice and quick without JS and a little slower with JS.
I saw this site and was wondering if anyone had used a similar approach or any other that allows these items to load once everything else is completed and in some cases not till the user scrolls the item into view?
Cheers,
Denis
Well as a starting point you could use the jQuery load functionality to load certain bits in which you know will take longer (such as google maps). This is very simple and can be achieved with:
jQuery(function(){
// Load google map
jQuery('#map-holder').load('/resources/lazy/map-loader.ext?q=' + an_id);
// Load similar properties
jQuery('#similar-properties').load('/resources/lazy/similar-properties.ext?q=' + an_id);
});
And then using the lazy loading plugin, im sure you could just put the above calls in functions and hook them up to the lazy load plugin.
Ok so what I'm looking at doing is using http://labjs.com/ for the js resources I need on the page at startup and then using http://www.codeproject.com/KB/ajax/selfloadelement.aspx as an approach for loading sections that can't be added to the page after the initial load.