I found a good example here but I had no idea how to use the code.
First, I tried the code in Blogger, nothing showed.
Second, I tried the code in jsfiddle, nothing showed too.
Third, I exported the code and pasted it in Blogger, nothing showed. >:(
The code only works when I use the exported .html and the online sample.
http://codepen.io/ccrch/pen/yyaraz
Does Blogger not support the code or do I use it wrongly?
Have you remembered to include jquery?
This code depends on the Jquery javascript framework.
Simply include the jquery script above the script like so:
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="js/yourScriptHere.js"></script>
You must also place script tags to open and close the script. The JS code on the CodePen link does not include those tags.
Script opening and closing tags look like this:
<script type="text/javascript">
</script>
In between those tags, you'd copy and paste the JavaScript from CodePen i.e.
<script type="text/javascript">
$('.tile')
// tile mouse actions
and so on...
</script>
Also copy and paste this link to the latest jQuery script, as BlitZz mentioned:
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
If after doing that, the image does not zoom, please paste a link to your live page.
Related
I have installed Nicedit tool to convert <textarea> into richtext box on my pages by adding the following code as per their instructions on their website:
<script src="http://js.nicedit.com/nicEdit-latest.js" type="text/javascript"></script>
<script type="text/javascript">bkLib.onDomLoaded(nicEditors.allTextAreas);</script>
However textareas got convereted (Nicedit worked fine) ONLY on my localhost Xampp, but when i uploaded the pages online, everything works fine except for the Nicedit, it doesn't work at all.
Please note that no error messages appeared, nor with textareas the issue is that textareas appear plain just like the standard, like if I didn't install the Nicedit.
Note: I have tried the following code as well since I've seen it as an example on their page, but it doesn't work also.
<script type="text/javascript" src="http://js.nicedit.com/nicEdit-latest.js"></script> <script type="text/javascript">
//<![CDATA[
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
//]]>
</script>.
PHP version used online is 5.6, if this would be useful info.
Since I couldn't find the reason to fix the issue that I have, I've found another tool created by the same programmer of Nicedit, it's name is CKeditor.
it's really nice, however browsing the website would take you into the direction of downloading and using JS code from your site, but I have found the following way to let it work as CDN.
First in the <head></head> tags copy the following:
<script src="https://cdn.ckeditor.com/4.7.1/basic/ckeditor.js"></script>
then inside <body></body> copy this code (presuming text1 is the name arttibute for the <textarea> that you want to convert.
<script>
CKEDITOR.replace( 'text1');
</script>
Hope this would be helpful for everyone.
I'm new to JavaScript. I need a CSS text animation to setup a part of my website. Here I found an attractive animation link is in the 3rd comment because stackoverflow doesn't allow me to put the link here (keep showing an error)
When I copy these HTML code, CSS code and JS code and create a webpage including them, It doesn't work properly. Actually no any animation.
How can I solve this to work?
For javascript
Make script tag and copy all the JavaScript between it.
<script>...</script>
For css
Make a style tag and copy all the CSS between it.
<style>...</style>
And to fix your problems double check your code and see whether you are missing some library or not.
The codepen project us using jquery, font-awesome and other things. This will help you import some of them.
<script src="https://use.fontawesome.com/230e98b440.js"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
This is an Option :
Signup in the codepen.io
Goto your link
Click on the Export button at the right bottom corner
Select Export.zip
After download the zip file, unzip it
Open index.html and you'll see the result.
Check the code of index.html for the missing codes
On my webpage there is supposed to be an image slider (carousel). My one problem is, it's not loading correctly. As you can see on my site there are 4 bullet points and 4 images next to them. Could you see if i am missing anything in terms of my files being incorrect? I will also add a link to the site where you can find my image slider, and i also added a link to my site to help on your end.
-Thanks!
My site: http://rootforsite.azurewebsites.net/
ImageSlider: http://bxslider.com/
Your javascript to init the bxSlider isn't working, it looks like you may have an errant "style" tag or something (it's trying to close a style block, the body, and the html all within your script), also make sure to include type="text/javascript" in your tag, and finally it's usually safest to do you jQuery onLoad functions like so:
jQuery(function($){
$(...).blahblah();
});
Then "$" will be scoped a bit better.
first of all you are using
<script src="myscripts.js"></script>
before loading jquery.
Please always use jquery scripts after loading jquery.min.js
also try to load the
<script src="js/jquery.bxslider.min.js"></script>
after bootstrap.js
I am trying to get the truck to drive across the screen Directly under my nav menu in Wordpress. The code executes perfectly in js fiddle , but when I try to load the JavaScript file, all I get is a still image (JavaScript is not loading)
Here is the working js fiddle:
http://jsfiddle.net/J2RPq/60/
Here is the code I applied to page.php:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="//pimpdaddy1337.com/wp-content/themes/twentytwelve-child/john.js"></script>
<div id="animate">
<img id="plane" src="http://thumb10.shutterstock.com/thumb_small/507037/507037,1274380827,2/stock-vector-black-and-white-big-rig-silhouette-53528596.jpg" /></div>
</script>
CSS
css :#animate { position: relative;}
Can someone help me with this error?
Regarding jQuery and Wordpress...
First, you should never load jQuery using the <script> tag when using Wordpress. Wordpress has it's own method for how stuff should be loaded. You can read more about there here: http://matthewruddy.com/using-jquery-with-wordpress/
Second, you may already have jQuery loaded in your Wordpress. Wordpress themes frequently already have jQuery installed, but it runs in No Conflict mode. This means that instead of using $ in your functions, you need to write out jQuery.
Hopefully that gives you a starting point troubleshoot...
You shouldn't need to load jQuery, WordPress should load a version already.
You have an extra </script> at the end of your html that doesn't appear to belong.
Make sure you place your script tag <script src="//pimpdaddy1337.com/wp-content/themes/twentytwelve-child/john.js"></script> inside of your <head> tag in header.php, try right before the line </head>.
Make sure your div is placed in page.php (assuming that's the correct template file). You should be able to see it even if the script isn't firing, and if you can't there is some other problem.
Sample code
<div class='credit'>
Copy blabla
</div>
in the code above I will add content and links
$(document).ready(function(){
$('.credit').append(' credit by blabladot');
});
but I tried and did not work, how the code is correct?
You need to make sure you add the latest version of jQuery library in your HTML's <head></head> section as follow:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
Also, make sure that other jQuery files or scripts are included after the above link.
Working fiddle Demo
You have forgotten to include jQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
Working jsFiddle here.
If you are using it in a blogger template, check this. I would recommend you to take a look in your developer console (in chrome) or firebug (in firefox) for any javascript errors and mention them in the question.