I would like to use MathJax within my website, and I have opted to use a CDN method. MathJax.org states that you can put
<script
src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML'>
</script>
within the HTML <head></head> tags and provided a pre-populated example on jsbin
However, I have noticed when using MathJax within WordPress, the MathJax documentation suggests using
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
I have noticed, that the difference is in the main part of the src address where the CDN used is cdn.mathjax.org instead of cdnjs.cloudflare.com, and the address points to mathjax/latest/MathJax.js instead of mathjax/2.7.2/MathJax.js.
I have put the second script into the jsbin example to see if there is a difference in function, and the example still works. Is it preferable (or more correct) to use the second script over the first one whether using WordPress or not, with the understanding that the second one will point to the most up-to-date version of MathJax?
As #Bob__ pointed out, and I had just read prior to then, MathJax was shutting down its CDN and they actually
retired cdn.mathjax.org in April, 2017.(Source: docs.mathjax.org)
The same webpage states that there are many free CDN providers that provide copies of MathJax. Some provide “rolling releases”, i.e., links that update to the latest available version upon release, and cdnjs.com is recommended. This matches Mathjax.org's page at https://www.mathjax.org/cdn-shutting-down/
They say
To jump start using cdnjs, you accomplish the first step by putting
<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
into the <head> block of your document
Note: the configuration file TeX-MML-AM_CHTML is a great way test all input options at once. You can find leaner combined configuration packages in MathJax documentation.
Interestingly, before seeing that, carrying out a MathJax libraries search on cdnjs.com provides an updated script tag of
<script
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.3/MathJax.js">
</script>
So the answer is to check for the latest library script tag in cdnjs.com, which is currently for version 2.7.3 and use that one. Currently
<script
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.3/MathJax.js">
</script>
and if you wish to use the TeX-MML-AM_CHTML configuration file, use:
<script
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.3/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
Related
I've just started looking at using the HERE Javascript API and wish to display the map in an embedded web browser. (I'm using Delphi, however this problem might apply to any development tool that supports embedded browsers). I'm using the quick start example:
https://developer.here.com/documentation/maps/topics/quick-start.html
The HERE logo displays in the bottom right, and the copyright notice in the bottom left, but the map does not display. Identical HTML being loaded from a file displays OK in Edge.
I have an entry in the registry in:
HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION
For my application, and have tried values of 11011, 11001, 99999, 9999 and 11001, however the result is all the same. Are embedded browsers not supported, or is there something else I need to do?
EDIT:
Doing the same thing in a Visual Studio C++ MFC app results in the same behaviour
EDIT 2:
Now that Delphi has support for embedding Edge browser - still the same issue, i.e. HERE logo and copyright shows, but no map. Can someone from HERE actually respond and indicate whether it's even possible to use an embedded browser? (MFC app which uses Edge didn't work, either)
EDIT 3:
A colleague suggested opening the DevTools and checking the console for errors - here's the result:
This is what I found while making it work in the webbrowser control of MS Access (embedded IE). You have to use P2D engine and legacy javascript files from Here maps. I did and now the map is shown but it's not draggable yet, don't know why.
I put 11001 in my registry but I also add this line to my html:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Then you need at least these links to have legacy support (in this particular order):
<script src="https://js.api.here.com/v3/3.1/mapsjs-core.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.1/mapsjs-core-legacy.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.1/mapsjs-service.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.1/mapsjs-service-legacy.js" type="text/javascript" charset="utf-8"></script>
And this option in the map initialization:
engineType: H.map.render.RenderEngine.EngineType.P2D,
It turns out that using NavigateToString in ICoreWebView2 does not work with HERE.
The solution was to use a file for the HTML, and use Navigate with a URL of, for example: file://C:\HTML\Here.html
I can't properly add in the CDN for moment.js to my HTML page. I'd rather just add a link in my html than install. Anyone know how to this? I've tried a few CDNs and nothing is working. Is there a reason to put the link in the head vs just before closing body tag with other JS links? I've seen it done both ways.
If you want to point to the latest,
You can link directly from their website.
Here is the link,
https://momentjs.com/downloads/moment.js
You can use the following link for the moment.js:
<script src="https://rawgit.com/moment/moment/2.2.1/min/moment.min.js"></script>
The imports done in the head suppose to load onto DOM before the content of the body vs at the end near the body closing tag, when all the code above supposedly have been load onto the DOM
However, we often deal with async code when working with javascript.
So, if you have a local script that depends on an external CDN library to be available, you can add defer to the end of your local script. the defer will wait for all content to be available on DOM to continue loading.
example:
<script src=xxx" defer></script>
I would place where it looks more cohesive. Perhaps you sign the loads with async and defer to deal with the loading order, depending on the scripts relevance. Find more on the primary discussion.
There may be a better forum for this, but here's my problem:
I'm using several different CDN sites for CSS, jQuery, jQuery Mobile, jQuery.validate, etc. Sometime in the very recent past (last few days) the CSS that jQuery validate uses stopped highlighting the affected text boxes in red, and changing the messages to a red font.
I initially thought it was the addition of blockUI.js & css, but then I noticed that all of my fiddles I created to make the bits & pieces of this project had been affected as well, and none of them had ever had blockUI added to them, so that wasn't it.
Then I thought maybe something had changed in Chrome, so I tried in Firefox, same thing. I have a remote server where I upload test code, and it was still working normally, until I reloaded the page, then the same thing. That tells me that the change occurred in one of the CDN based files.
My question is, since I don't have downloaded versions of each of the .js & .css files, how can I determine what the change was? Is it possible to download the previous version (the version numbers in my references hasn't changed, so there's no way to tell from them.
I know I can simply go create my own .css for the highlighting & font issues, but it seems like whoever hosts these various CDN's shouldn't change them underneath you? FWIW, my primary suspect is: http://jquery.bassistance.de/validate/demo/css/screen.css, especially since it hasn't been versioned. I haven't had a chance to try to verify this yet.
For reference I'm using this array of CDN locations for my current project:
<link href="http://malsup.com/jquery/block/block.css?v3" rel="stylesheet">
<link href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" rel="stylesheet">
<link href="http://jquery.bassistance.de/validate/demo/css/screen.css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/additional-methods.js"></script>
<script type="text/javascript" src="http://malsup.github.io/jquery.blockUI.js"></script>
<script type="text/javascript" src="pcbclient.js"></script>
There is no CSS file as part of jQuery Validate. This plugin simply toggles two class names and those have always been .valid and .error.
The root of your problem is right here...
<link href="http://jquery.bassistance.de/validate/demo/css/screen.css" rel="stylesheet">
That's not a CDN link, nor is that CSS file part of the plugin. It's the CSS file used solely for the online demo page.
Everything broke for you because that URL no longer points to a CSS file. However, you should not have been hot-linking to another website's CSS file in the first place. (If it's not a URL from a CDN, it could be considered as stealing the other website's bandwidth.)
If you liked how that online demo page looked, you could have easily examined and copied its CSS properties into your own CSS file, provided that the copyright license allows it.
You might want to carefully review the rest of your file includes' URL's to make sure those are all part of an official CDN and not just hosted on these developers' websites.
It appears I was correct in surmising that the problem laid with the CSS at: http://jquery.bassistance.de/validate/demo/css/screen.css.
I still don't know what changed, but I downloaded the source from: http://jqueryvalidation.org/ (as I should have after deciding to use it), added it to my ASP.NET project and the problem has been resolved.
I'm trying to make my meteor app visible to crawlers.
I've added the Spiderable package and installed Phantom.js.
When I to go localhost:3000/?_escaped_fragment_=, it's blank.
When I view the source, it's almost empty, and it ends right before the <script> tag that loads the Google Maps API:
<!DOCTYPE html><html><head>
<link rel="stylesheet" href="/eecc60f7c55db2915697d4beb05274f355ad19e4.css">
<title></title>
<!-- Google Maps -->
</head></html>
I haven't encountered any issues with this before, but it got me thinking that maybe I shouldn't be including custom <scrpit> (or <link>) tags in the app's <head>. If this is true - what is the correct way to load external assets? If it's not related to the issue, I'd appreciate any advice.
Thanks!
In relation to your first question, I am not 100% sure about this being the cause of your problem, but to answer the second, you shouldn't be including scripts/stylesheets in the head of your Meteor application.
Meteor combines all of the client-side js, css, and html for your app, and sends it all together to the client. This means you can just include your stylesheet and scripts in your app's client folder. I would try putting your stylesheets/scripts in the correct place and removing the links in your head and see if that solves your issue.
You can find more detailed descriptions of meteor here.
I'm trying to implement a TinyMCE plugin with ExtJs, with a demo as example, found here: link.
This fails because I receive an "Ext is not defined" error in Firebug. I basically copied the example, I only used a newer version of Ext. First of all the css and scripts are included:
<link href="scripts/extjs/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="scripts/extjs/ext-all.js" type="text/javascript"></script>
<script src="scripts/miframe/miframe-min.js" type="text/javascript"></script>
<script src="scripts/tinymce/jscripts/tiny_mce/tiny_mce_src.js" type="text/javascript"></script>
<script src="scripts/ux/Ext.ux.TinyMCE.js" type="text/javascript"></script>
Firebug does not complain, all the scripts are found on the specified paths and are included.
Next I call the Ext function in the head of my aspx document,
<script type="text/javascript">
console.log("Ready...");
Ext.onReady(function() {
console.log("set...");
Ext.get("cmdOpen").on("click", function() {
console.log("GO");
var dlg = new Ext.Window({
//etc
</script>
The console.log("Ready...") shows up in the console, then the code breaks. There are four references to "Ext is not defined", in ext-all.js(), miframe-min.js(), Ext.ux.TinyMCE.js() and in the code in the .aspx file. (Default.aspx)
I did not alter any aspect of the included files, they are official releases.
Am I perhaps missing a statement somewhere? Or do I have to include other things still? I have honestly no clue.
Even when including ext-all(-debug).js, you still need to include the ext-base.js file before that, otherwise you will get the "Ext is not defined error". Not sure by your last comment if you are already past this or not, but I thought I would point it out. Please see this page for complete details on how your includes should be set up:
http://www.extjs.com/learn/Tutorial:HTML_Page_Setup
there is a firefox extension called "jsview", it allows you to see what scripts and css files are included on a page.
When navigating to the link you include at the top of your post and opening the ExtJs file, you'll notice that the example provided is using version 2.1 of the code.
The Ext.ux.TinyMCE v0.6 has a corresponding blog post here. You will notice that it specifically requires:
Firefox 2+, Opera 9+, MSIE 7
ExtJS 2.1
TinyMCE 3.1.0.1
Ext.ux.ManagedIframePanel
Be aware that when plugging in a newer versions of the TinyMCE or ExtJs libraries, there might (read will) be breaking changes that you will then have to resolve. You could try scrape the files directly from the example to ensure you have a working version.
If you choose to use ExtJs v3+, get the latest components:
1) ux.ManagedIframe has been maintained more recently and even upgraded for ExtJS 3.x here
2) Read through the ux.TinyMce thread and download the latest version. I think it's 0.7b. If you're still having problems, that's probably the best place to find answers.
copy the lib folder in your eclipse workspace`s exjts project folder and just give the relative paths, is should than work
Go to ExtJs website and make sure you download and included all the necessary files and IN ORDER,also using a newer version might break the code.
try it with simpler examples and only reference the ext stuff and see if it loads