Incorporate MathJax onto Weebly website - javascript

I run a weebly.com website.
Following instructions to incorporate MathJax, http://www.dessci.com/en/support/MathType/works_with.asp#!target=weebly
First step I completed, i.e. copy and paste
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
on all page layouts, just before </head>
Next set of instructions are unclear, i.e.
From MathType's Preferences menu choose: Cut and Copy Preferences.
From the Equation for application or website group, choose MathJax:
LaTeX from the list. Click OK.
Where do I find "MathType's Preferences menu"?
Thank you

Researched some more.
Solved it with placing the following on each header page, before </head>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']],
displayMath: [['\\[','\\]'], ['$$','$$']]}});
</script>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>

Related

javascript reports that "$" and "alert" are undefined

Just embarking in learning yet another language (JavaScript) and following instructions from a tutorial. I have node and Brackets (the editor) installed. The tutorial was requesting the following to be put in a file named
"app.js":
$('form').on('submit',function () {
var text = $('#message').val();
alert(text);
return false;
});
The problem I have is that the system immediately complains that "$" (two places) and "alert" are undefined.
The index.html file was originally requested to specify:
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script src="app.js"></script>
at the bottom (which caused the system to complain with an earlier simplified version about 'alert') but I replaced it with the following after visiting the code.jquery.com site:
<script
src="http://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<script src="app.js"></script>
This solved the alert issue when the .js file was nothing more than a 'hello world', but now I have a "problem++" with the next version of the .js file shown above.
I suppose it could be something about the installation and/or paths; but I am at a loss figuring where that could be and how to fix it. Can any expert suggest something?
For the record: I am on a Windows 7 machine, using Chrome to display the html file.
Many thanks
Edit:
additional complete text of 'index.html' file:
<link rel="stylesheet" href="style.css">
<main>
<ol id="history">
<li>commander says: no offence, but you are a robot, aren't you?</li>
<li>roobie says: that is correct, sir</li>
<li>cookie says: hey doc, is that a male or a female? </li>
<li>robbie says: this information is meaningless</li>
</ol>
<form>
<input id="initials">
<input id="message">
<button>Send</button>
</form>
</main>
<script
src="http://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<script src="app.js"></script>
did you add the jquery link twice?
Please remove all jquery links and do the following:
remove all previous jquery links.
Add this code snippet between your head tags.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

code working in home page but not in inner directory-just shows loading

my code works fine in home directory but in inner directory it keep on showing loading image.never shows original page
here is my simple code
<html><head><style type="text/css" media="all">#import "http://static.something.com/files/common_css/style16.css";</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http://static.something.com/js/lightbox/js/jquery.lightbox-0.5.js" type="text/javascript"></script>
<script type="text/javascript" src="http://something.com/js/jquery.form33.js"></script> <script type="text/javascript">jQuery(document).ready(function($) {$('a[rel*=facebox]').facebox()}) </script>
</head><body>
<?php
echo' <body style="cursor:auto" id="curpo" onLoad="$.image({ ajax: \'http://something.com/jquery/desigirls/77987\' });return false;" class="uiMediaThumb uiMediaThumbLarge uiMediaThumbAlb uiMediaThumbAlbLarge"></body>
';
?></body></html>
this code works fine here http://something.com/testage.php
but not works in this page http://www.something.com/touch/w2et/testage.php
everything is same.i think there is some issue with javascript or image references.i tried changing all but same problem.
here is jsbin link as well
jsbin.com/royepawomi/edit
here also it is not working
The two links you have posted are two different domains
www.way2enjoy.com and way2enjoy.com. I would suggest picking just one and using that.
The reason for this is you cannot do cross domain AJAX requests. Having the www. in one means they are treated as separate domains.

ckeditor slow to load

I just installed the very basic level of ckeditor and noticed that it takes quite a while to load on each page load.
Here's a (HTML5) gif of the loading (this is slightly faster than normal): gif here
I'm not doing anything that would pop out as problematic so I'm not sure why it takes so long to load. Is there any way to have the textarea never show up, so that it doesn't look as if it's "popping" into the ckeditor like it does in the gif?
These are the only JS scripts that I have on this page:
<script src="js/jquery.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="ckeditor/ckeditor.js"></script>
Please help
Replace those scripts with:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ckeditor/4.3.2/ckeditor.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ckeditor/4.3.2/adapters/jquery.min.js" type="text/javascript"></script>
Remove the current <textarea> and replace your current CKEDITOR.replace(...) script with this:
<script>
$('<textarea/>').attr('id', 'text_field').css('visibility', 'hidden').appendTo('#ckeditorArea').ckeditor(function(textField) {
$(textField).css('visibility', 'visible');
});
</script>
This uses the jQuery adapters method .ckeditor() to initialize the editor on the new element, rather than using the traditional CKEDITOR.replace() method.
Initially the textarea will be in the page but hidden, then will be visible once the CKEditor interface is applied.
CKEditor Loading performance details:
http://ckeditor.com/blog/CKEditor-Loading-performance-details

prettyPhoto Not Working - Error: Not a Function

I'm having some issues with prettyPhoto on one of my clients website. Here is the link for reference: http://www.browardmicrofilm.com/pages/kodak-vizit-essential.html
I've used prettyPhoto on multiple other websites without issue. However for some reason, this website just doesn't want to perform the script properly. Instead of opening an image in the lightbox clone, it simply opens it in a new page. Perhaps it has something to do with the hosting but either way, wanted to see what professionals like you think!
I'm using Firefox 26 (Mac version) and I used Firebug to determine the error:
TypeError: $ is not a function
$(document).ready(function(){
I've tried numerous solutions, including one that made me change "$" to "window.jQuery and then for some reason the next line in the code creates the same error.
Here's the my code for those of you that wish to skip the entire page source code:
In my header:
<link href="../prettyPhoto.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../Scripts/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="../Scripts/jquery-1.6.1.min.js"></script>
The final script just before the closing body tag:
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto({
theme: 'light_rounded',
});
});
</script>
I know my links are good, which is why I'm not including them.
Vanilla jquery needs to be declared before any library built on top of it
<!--first, jquery-->
<script type="text/javascript" src="../Scripts/jquery-1.6.1.min.js"></script>
<!--then the rest-->
<script type="text/javascript" src="../Scripts/jquery.prettyPhoto.js"></script>
Error below is saying that jQuery is not loaded.
TypeError: $ is not a function
$(document).ready(function(){
Check your resources, my guess is that your paths are case sensitive and libraries are not being properly loaded.
<script type="text/javascript" src="../Scripts/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="../Scripts/jquery-1.6.1.min.js"></script>
Check your resources.
Make sure that jQuery is loaded before the plugin is loaded.
<script type="text/javascript" src="../Scripts/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery.prettyPhoto.js"></script>
Ultimately I abandoned the prettyPhoto javascript and went with an alternative. Lightbox 2.0:
http://lokeshdhakar.com/projects/lightbox2/
It works just as I'd like and no problems.

Try Sencha Touch examples locally

Can one download the source code and try out the examples for local testing . E.g. I am trying to preview the example on my iPad (after downloading locally), but am unable to see anything;
http://dev.sencha.com/deploy/touch/examples/oreilly/
I know for commecrial use, we need to pay, But just need to try it out first...
Actually as far as I understand, you don't need to pay for commercial use either for Sencha Touch. If you want a support plan, then you need to pay, otherwise the license is free (See the top of [the pricing page][1] which says "Free license!".
To view the examples:
Download the source code from http://www.sencha.com/products/touch/download/1.1.0/
Unzip the file (e.g. /home/username/sencha-touch-1.1.0)
Open a browser (Safari or Chrome only) and go to
file:///home/username/sencha-touch-1.1.0/examples/oreilly/index.html
If you want to navigate any other examples, point your browser to:
file:///home/username/sencha-touch-1.1.0/examples/
Right click on the page > View Page Source > On the top you'll see the script files >
<script type="text/javascript" src="../../sencha-touch.js"></script>
<!-- <script type="text/javascript" src="oreilly-all.js"></script> -->
<!-- Application JS -->
<script type="text/javascript" src="src/index.js"></script>
<script type="text/javascript" src="src/Models.js"></script>
<script type="text/javascript" src="src/App.js"></script>
<script type="text/javascript" src="src/SessionList.js"></script>
<script type="text/javascript" src="src/SpeakerList.js"></script>
<script type="text/javascript" src="src/HtmlPage.js"></script>
<script type="text/javascript" src="src/SpeakerDetail.js"></script>
<script type="text/javascript" src="src/SessionDetail.js"></script>
<script type="text/javascript" src="src/LocationMap.js"></script>
<script type="text/javascript" src="src/AboutList.js"></script>
<script type="text/javascript" src="src/VideoList.js"></script>
<script type="text/javascript" src="src/TweetList.js"></script>
You need to basically download these one by one and then reference them manually in your local html file which you'll need to test.
That's the way to actually access the examples. However I would prefer you go through their screencasts, you'll get the source code for them easily from github.
e.g. For this screen cast: http://vimeo.com/15672696 , you can get the source from https://github.com/nelstrom/GeoTweets

Categories

Resources