I downloaded a template and open it directly, it gives me an error for the slider.
!! Error at loading Slider Revolution 5.0 Extrensions.
Local Filesystem Detected !
Put this to your header:
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.navigation.min.js"></script>
Again I uploaded to local server, there is no error but an empty slider.
I checked the inspect element, it shows the errors in the below image:
Looks like you're trying to get those files from a folder, js, in your source folder; that's not where they are located. With a quick Google search I found that those were located on another website, http://iccila.com.br.
The fixed <script> tags:
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.slideanims.min.js">
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.layeranimation.min.js">
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.kenburn.min.js>
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.navigation.min.js">
</script>
It is a cause of jQuery conflict. First I recommended upgrading your revolution slider.
Step to fix:
Go to bakend and click Slider Revolution
Click Global Setting.
Click on buttons
Insert JavaScript Into Footer:
Defer JavaScript Loading:
Make sure revolution.extension.slideanims.min.js and other js files you are adding are in the folder js/vendor/revslider/public/assets/js/extensions/ and also that the js folder is in the same folder as this page that you are trying to open.
=======
If it isn't then specify the exact location in place of js/vendor/revslider/public/assets/js/extensions/
I had similar issues with Magento Rev Slider.
The problem was the caching extension that I have used. Amasty Full Page Cache.
I disabled and tried and everything worked fine.
So, I recommend you to check if all files exist with proper permission.
Then check and see if the page is cached.
Try and fully disable cache.
Also disable Chrome or browser Cache
It worked for me.
You also need to add this to your page revolution.extension.slideanims.min.js to your files.
I had the same exact problem I solved it by downloading this revolution.extension.slideanims.min.js file and then adding it to the folder
Then the mentioned code should be added at the bottom of the page.
Basically just look at your folder and see if all the mentioned js files exist. If they don't download them and add it manually.
You need server Environment to run Rev slider in local pc.
Like put all files in local host or upload in web server.
It will work.
Thanks
Related
I am very new to web design and trying to build a responsive page using Bootstrap. Everything works except my linked JS. I am sure the path is right but neverthelast I tried to put my JS on server and indicated the full path through http:// but still not working. I even put all my scripts in the head section just in case but still not working. Start getting frustrated anyone please can help me guys :) The JS is in the 'scripts' folder which is in the same folder with my 'index.html'.
This is my html in the head section:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="scripts/script.js"></script>
And here is my external JS:
$(document).ready(function(){
$("#menu").slideUp("slow");
});
Your problem is loading in the jQuery. It's trying to load your first script from a relative path. Try replacing the first script with <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
I recently need to embed Ace in my project, So I download the pre-build code from https://github.com/ajaxorg/ace-builds/ and I copied the code into my site from https://github.com/ajaxorg/ace-builds/blob/master/editor.html where it lists how to embed Ace into a web page.
I copied that the src-min folder into my project. I changed the
<script src="src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
into
<script src="js/src-min/ace.js" type="text/javascript" charset="utf-8"></script>
When I try to browse the web page in sandbox in codeanywhere.com (I also uploaded the src-min folder), I can only see the continent in and there is no area for me to enter something new. Also, the code is in black and white.
What could I be doing wrong and what can I do to get Ace working properly?
First thing in such cases is to look into browser console to see if something blocks loading the script.
As you commented, you have "frame is sandboxed and the 'allow-scripts' permission is not set."
That's likely a problem with codeanywhere, try running it locally or use another service.
SO my file hierarchy that is the same on my desktop as it is in my web-host file manager
1- This is my iframe from my code editing program (Adobe Edge Code) correctly working when I throw the page up in Google Chrome]
2- And this is my iframe not working when I have the page hosted in my web-hosts file manager.
1: https://pantherfile.uwm.edu/leyton/Screen%20Shot%202013-12-20%20at%203.51.37%20PM.png?uniq=-n0ztwi
2: http://leytonelizabeth.com/photography.html
I don't know anything about Javascript and definitely nothing about JQuery. All I know is that I have a code that correctly displays my website when I preview it on Google Chrome.
When I put all my files in the exact same hierarchical order in my web-hosting site's file manager, I navigate to it and it doesn't work.
Why does it point to the files and paths correctly when it's coming from my desktop and not when it's coming from Webhostinghub.com?? I transferred them over in exactly the same order. The paths are correct. So it must be something with jQuery. Can anyone give me some advice or things to try in order to get the iframe to display my photos?
Is it perhaps because there are several Core Scripts being referenced at the top of my photography.html page? do I need to update/download each version? Do viewers looking at my site need to go through all that too then just to potentially see the photos in my iframe? As you can see in the pic of the photo that properly works in the iframe, it points to the prettyPhoto jQuery and its respected gallery, not some other url..
I have NO IDEA what to do about this. Please help!!!
These are the scripts at the top of all my html5 documents/pages:
`<!-- Cufon Scripts -->
<script src="js/libs/cufon-yui.js" type="text/javascript"></script>
<script src="js/fonts/mank-sans.cufonfonts.js" type="text/javascript"></script>
<script src="js/fonts/Yanone_Kaffeesatz_Regular_400.font.js" type="text/javascript">
</script>
<script src="js/royale-cufon.js?v=1" type="text/javascript"></script>
<!-- Core Scripts -->
<script src="js/libs/modernizr-1.7.min.js" type="text/javascript"></script>
<script src="js/libs/mdetect.min.js" type="text/javascript"></script>
<script src="js/libs/jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script src="js/libs/jquery.easing.1.3.min.js" type="text/javascript">
</script>
<script src="js/royale.js?v=1" type="text/javascript"></script>
<!-- Bg Image Script -->
<script src="js/royale-bg-image.js?v=1" type="text/javascript"></script>
<!-- Added for Lightbox Script -->
<script src="js/libs/jquery.pretty-photo.min.js?v=1" type="text/javascript"></script>
<!-- Setup Script -->
<script type="text/javascript">`
1 Lots of your 'thumb' folders are empty.
2 The "big-sized" picture of teacup (the only thumb picture i can see) is referred as "img/portfolio/theaccident/tea.jpg", but the real file path is "img/portfolio/theaccident/Tea.jpg" (the capital letter matters)
So the problem is not in the scripts, It's in your export settings or your host defaults.
UPD:
3 Some links from your 'thumbless' pictures are pointing to correct 'big-sized' pictures (their first letters are not capitalized).
You definetely did something wrong when moving everything from desktop to host.
I wanted to use the loading page from here http://www.gayadesign.com/diy/queryloader-preload-your-website-in-style/
because the personal website I was making is very poorly optimized and loads quite slowly
The loading page works fine if I make it a seperate page and then redirect to my home page like so:
http://matthewpiatetsky.com/cs103/demo/demo.html
However, I have also tried adding this same animation when I go directly to the page, and it does not work. I think this is because of the other js files present in the document.
http://matthewpiatetsky.com/cs103/
In the redirecting page the script is located here and it works.
http://matthewpiatetsky.com/cs103/demo/js/script.js
In the actual page the script is located here and it doesn't work.
http://matthewpiatetsky.com/cs103/js/matthew.js
The script declarations in the actual page look like this, so this script is called last. Calling it first breaks the page, so I'm guessing the 5-grid js is the problem.
<script src="js/jquery-1.9.1.min.js"></script>
<script src="css/5grid/init.js?use=mobile,desktop"></script>
<script src="js/jquery.formerize-1.1.js"></script>
<script src="js/init.js"></script>
<script src="path/to/file/jquery.queryloader2.js" type="text/javascript"></script>
<script type="text/javascript" src="js/matthew.js"></script>
It looks like you are missing a plugin. Your code tries to use the QueryLoader2 plugin on line 19 of Matthew.js, but you don't have this plugin included on your page.
I used a image gallery engine called prettyPhoto.js in a WordPress site that I was creating. However, for some strange reason the image gallery seems to have completely stopped working and I can't for the life of me find out how to rectify this problem (without explicitly going through the entire site and stripping out the rel="prettyphoto" tags embedded in all the image anchor links.
I am wondering if the javascript or the CSS is not being output to the browser properly, but taking a look at the "Net" panel in firebug, it seems to be loading these files without a problem. I tried having a look at the <a> link referencing the images to be opened, and they all had the required "prettyPhoto" attribute.
The page in question is
http://instant-wine-cellar.co.uk/products/microcellar and try clicking on any of the microcellar pictures.
Another is the "Watch Microcellar Video" link on the front page.
For those who do not know. This image gallery script, same with a lot of others, works by:
1. putting the prettyPhoto javascript file in your server.
2. putting the prettyPhoto css file in your server.
3. referencing the path to the above files into the head (or footer) of your html file.
4. triggering the process by putting some bespoke script into your HTML file to find the <a> tags in your file with a certain rel attribute and opening the link it references, into the prettyPhoto modal box.
At first include jquery.js then plugin.
Find:
<script src="http://instant-wine-cellar.co.uk/wp-content/themes/Wineconcepts/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
Replace:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://instant-wine-cellar.co.uk/wp-content/themes/Wineconcepts/js/jquery.prettyPhoto.js" type="text/javascript"></script>