I'm making a website for a project, and I discovered and decided to use the, jquery flip plugin, and it's not working... I did manage to get it working a while ago, but couldn't since. Bear in mind I have not yet made the grafic part of the website yet, so what's there is just for show.
Here's the source code for the website.
No errors, just not working (fliping said boxes). As I said, it worked before, but when I added those other boxes, it stopped working.
Include jQuery UI before the Flip plugin. Since the Flip plugin needs jQuery UI to be available it probably fails when it's not.
It's always a good idea to use the demos on the plugin's documentation website as a template. The flip plugin includes the JS files in this order:
<script src="/lab/flip/js/jquery-ui-1.7.2.custom.min.js"></script>
<script src="/lab/flip/js/jquery.flip.min.js"></script>
Also, in your JSFIddle, you have to use absolute URLs for the resources, JSFiddle doesn't magically find jquery/jquery.flip.min.js.
Here is an updated version of your JSFiddle, I grabbed the above files from the plugin's documentation: http://jsfiddle.net/mNQJB/2/
If the above didn't fix your problem, there was an error with your code, one of the .flip calls had an invalid content property:
Uncaught SyntaxError: Unexpected token .
Make sure that your content properties are all on a single line or you have escaped the end-line characters properly.
Update
To escape an end-line character in JS we do this:
var str = "This is a string and \
I want it to use two lines.";
Notice the backslash, it's the standard escaping character. Now if you want to create a new line that will be rendered via HTML then you should use a <br /> tag:
var str = "This is a string and <br />I want it to use two lines.";
you have an unterminated string constant in this section:
$("#aimsb").bind("click",function(){
$("#aims").flip({
direction: 'bt',
color: '#39AB3E',
content: 'The aims of the GSP (Global Student Project) are to give students from all around the world both a culturally and personally enriching experience, as well as equal learning, and subsquently job opportunities
.'
});
});
note the line feed prior to the .'
Related
Problem: Hi, this ‡ character is getting rendered correctly on my webapp.
I have tried using html entity as well but still its showing as ‡ Or ‡.
The caracter ‡ or maybe similar to not equal to (≠) , was a scpecial character.
And need another syntax, to be shown like that.
I can recommend you to use this line of code
<span style='font-size:100px;'>≠</span>
For more details, we can read this link of reference .
Hope it was helpful.
Thank you
I do know good HTML and some PHP, but not at all javascript, so I need some help with this question please. I have a wordpress site the uses math equations together with Simple Matjax plugin for rendering the math from latex. There are many worpress plugins for latex some of them faster, some of them slower.
I tried to find a faster plugin to replace Simple Mathjax, but every other plugin use a different math "quotation" than that I am using $...$
So I need a javascript that either replaces the $...$ with $$...$$ or first $ with $latex (or whatever start and end sequence I might need for a specific plugin). I guess this is simple, but as I was saying, I do not know javascript at all. Thank you.
PS. There is one replacement WP Quick Latex but when I install it it block the access to my homepage (all other pages are rendered and displayed, except my homepage, page 2, page 3,...that contain excertpts). Any suggestions? Edit: Quicklatex uses shortcodes [latexpage]. If one enables it sitewide on the homepage it has to work on all equations, Thus the wating time for loading the homepage increases significantly.
The javascript function for string replacement is
replace("string to replace", "new string")
I think you should do something like this:
var string = "$"; // <-- this is where you enter the string you want to replace
var new_replaced_string = string.replace("$", "$latex");
Hope this helps.
Im working through Django By Example and in one chapter a Jquery bookmarklet is built within a Django app so that a user can easily save jpg images from a website into their user profile area within the Django app.
Im not an experienced JS or Jquery programmer but I did some JS some years back and can read the code however the tutorial does give exact instructions on what to do which I have followed and although I have managed to get the bookmarklet button to appear in my bookmarks bar in Chrome, nothing happens when I click it when browsing a webpage with jpg images.
This is my local Django dashboard where the bookmarklet button is added to the bookmarks bar and this part works fine
and this is what it should look like when clicked on, this is the part where nothing happens for me
these are the relevant js files
https://github.com/davejonesbkk/bookmarks/blob/master/images/templates/bookmarklet_launcher.js
https://github.com/davejonesbkk/bookmarks/blob/master/images/static/js/bookmarklet.js
the only thing I can see that is different with these compared to the files that came with the book is the indentation is a bit off but for some reason the indentation does seem to have changed a bit when I uploaded to Git and they dont look like that locally. Is indentation important in JS?
I followed the same book with the same examples but didn't had any trouble. Make sure your dashboard.html file is referring to the correct javascript file. If nothing works try to add the bookmark manually, you can see how that's done over here http://www.howtogeek.com/189358/beginner-geek-how-to-use-bookmarklets-on-any-device/ it'll sure to work.
And answer to your last question, Indentation is not as important in JavaScript as it's in Python, as python doesn't use any curly braces "{}" or semi-colons ";". But you can write your entire javascript code in a single line and it'll work because your using curly braces everywhere to tell which line of code ends where.
I agree with all the above. In addition, the following:
Error I noticed in the book:
In bookmarklet-launcher.js the js function being called from bookmarklet.js is called myBookmarklet(), however there is no function called this way in bookmarklet.js. So, you may want to use the same name in both js files.
Practically speaking however, the bookmarklet will always work because, not finding a myBookmarklet function in memory, bookmarklet-launcher.js appends the bookmarklet.js script to the body element and, being bookmarklet.js a self-invoking function, its content executed (without the need it to being called). There are some additional interesting technicalities here (the key function in bookmarklet.js is not self invoking but it will anyway be always called because of the script checking whether jQuery is present...) but ok, this is more relevant for those busy with the mentioned book (Django 2 by example).
Check whether bookmarkled, once you click on it, is added to the
current webpage:
2.1. Open devtools (F12 on Chrome) and check e.g. in the html head element whether you find the newly added link element containing the css attribute and/or in the body element whether you find the script element containing the reference to the bookmarklet.js file.
2.2. Alternative: Add an alert message on top of the bookmarklet.js script so that it will be launched if it is correctly loaded. Example:
(function(){
alert('bookmarkled loaded!');
var jquery_version =...
Make sure you're trying to use it on a HTTP site only. Since you're serving from same protocol. HTTPS site would always tell say: There is a problem loadingbyour jquery. That's how I solved mine.
dude.I have solved the problems I met like you.
The most important thing is that noticing the syntax error(without warnings),mainly caused by ignoring blank.
for example, in the line:
jQuery('#bookmarklet .images').append('<img src="'+image_url+'"/>');
between #bookmarklet and .images should lie a blank space,because of jquery syntax rules(meaning to search tag with id of bookmarklet and search tag with class equaling images within result previously).
Another two places worth notice are codes containing #bookmarklet .images a and #bookmarklet #close,requiring blank spaces between filter condition.
That's where I found I made mistaks mainly after studying syntax of jquery.
You'd better compare your codes with codes already loaded up to github by someone to make sure there are no more little errors(such as spelling).
I'm working with a VisualForce page (SalesForce related) and I need to write a piece of JavaScript that will replace some text on the page after everything is loaded.
I've tried the following (I'm using jQuery on other parts of the page so I've used jQuery for this also):
var j$ = jQuery.noConflict();
j$(document).ready(function()
{
var replaced = $find("body").html().replace('Test', '1234');
$("body").html(replaced);
});
Unfortunately it doesn't seem to do anything. It's like I can't get the page HTML code. I'm assuming it's because this is a VisualForce page running on the Force platform, so if anyone can offer any help with this that would be much appreciated.
Thanks.
P.S. In case anyone is wondering why I'm doing this is because I can't do this through VisualForce or Apex since I'm trying to unescape some HTML characters provided by a variable and being used in a dataTable header. Unfortunately everything in a dataTable header is automatically escaped.
First of all, it should be $.find() but hum.. also not necessary: simply $("body") for a selector.
Then in one line you can write:
$("body").html($("body").html().replace(/test/g, '1234'));
Notice /g in the regex, it should allow it to replace all instance of test, not only the first one.
You might also need to be precise with your j$ and use it everywhere, not only for document ready event. The line above uses $ shortcut.
I'm aware of what WYMEditor is all about and that using Paragraphs for spacing is not intended, however the problem here is with the client requiring that we give them this functionality.
I've looked high and low to find where WYMEditor does it's stripping of whitespace and can't seem to find it at all.
It seems that when you press enter it creates a P visually, however when clicking the source it doesn't contain it. Furthermore, manually editing HTML source to contain <p> </p> doesn't work, as WYMEditor strips it out.
Just wondering if anybody has had this issue before and knows how to get rid of this functionality? It's worth noting that I believe the replacement is happening both in the 'text' module of Django-CMS, and also in the Javascript for WYMEditor.
Turns out, the function that does this stripping is very simply named, for some reason I missed it in (multiple!) searches for the word 'empty' in the script file.
It's located in jquery.wymeditor.js, line ~3440 there is the function WYMeditor.XhtmlSaxListener.prototype.removeEmptyTags, simply stop the replacement:
WYMeditor.XhtmlSaxListener.prototype.removeEmptyTags = function(xhtml)
{
return xhtml;// .replace(new RegExp('<('+this.block_tags.join("|").replace(/\|td/,'').replace(/\|th/, '')+')>(<br \/>| | |\\s)*<\/\\1>' ,'g'),'');
};
That obviously stops the stripping of whitespace!