I need a help in jquery camera plugin. I downloaded the plugin from
http://www.pixedelic.com/plugins/camera/
And I placed all the necessary JavaScript files downloaded from the site in the same location :
My php program is (it does not have any php scripts although the extension is .php) in the same folder as "js" This is the html code :
<script type="text/javascript" src="js/jquery/jquery-1.10.2.js"></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/jquery.easing.1.3.js'></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/camera.min.js'></script>
<script>
$('#camera_wrap').camera();
</script>
<div id="SlideWrapper">
<div id="camera_wrap">
<div data-src="images/slider/01.jpg"></div>
<div data-src="images/slider/02.jpg"></div>
<div data-src="images/slider/03.jpg"></div>
</div>
</div>
And when I run the program it does not show the images. I have done exactly how its instructed in the website. I have not added any features and changed any parameters.
I have placed the program in the webserver and it can be viewed at :
http://store.touchmedia.ca/mytest/TestCamera01.php
Please help me to make it work...
thanks,
Isaac
I found the answer in the following link:
https://groups.google.com/forum/#!topic/camera-slideshow/AgVzZjjJ75Y
Looks like the newer JQuery version(s) do not support JQuery Camera slider, must be because of certain functions/APIs required for the slider were removed in the newer version as mentioned by Nouphal (Thank You).
I downloaded the fixed version from the above link and you can see that in
http://store.touchmedia.ca/mytest/TestCamera02.php
From this, I doubt how far can we trust the plugins which were developed by somebody whom we don't know, and when newer version(s) of JQuery is/are released then the plugin would stop working, imagine we develop a website for a customer and after a few months it stops working and we don't know how to fix the plugin and will end up throwing questions at all the forums found in the internet.
Call function when DOM gets ready.
Write:
$(document).ready(function(){
$('#camera_wrap').camera();
});
It seems that the problem is due to inconsistency between your plugin and the jQuery source file. In your example you are using the latest jQuery version i.e 1.10.2. You should always keep in mind that with each new version some of the older and inconsistent api's are removed and new ones are added. I think this plugin may be using some of the removed or deprecated methods. This plugin is however compatible till jQuery version 1.8.3. You can find the jQuery change log here or here. i have created a working example of your problem in JSBIN
I updated this plugin. It is now compatible with jquery-1.10.2 and bug free
Latest version as of 01/29/2014 available at: http://www.orangecountyseomarketing.com/projects/slider.html
http://www.orangecountyseomarketing.com/assets/js/slider/camera.js
BUGS FIXED:
Resolved latest jQuery version with .on() instead of .live();
Can still include iFrame with Video, extended size of video to 100%, video can play with any host not just vimeo or youtube
Working Pause and Play buttons.
Hope this helps.
-Yamenator-
Related
I'd like to use this multi-level push menu in my webapplication. But the problem with this plugin is that it needs an older version of jQuery. It will crash in combination with v2.x.x of jQuery.
The owner has done this on purpose, so that older browser versions are covered with the plugin as well.
So I'd like to convert/migrate this script to make it compatible with the latest version of jQuery, the only problem is, is that jQuery isn't my 'thing' (yet). I'm not sure where to start, what to remove of what to add in the script.
My question basically is, can someone point me into the right direction to get this script working with the latest version of jQuery?
I'd really really appreciate any help!
EDIT:
UPDATED ANSWER:
Use Version2 from the Multilevel Push Menu download page! ::link:: ...
I downloaded that version, and changed from jquery-1.10.2 to jquery-2.0.3 ... and it's working perfectly! Here's a jsfiddle: jsfiddle.net/vLrp51g3
PREVIOUSLY ANSWERED
As suggested by A. Wolf, you can use migrate jquery js file to handle the older jquery version. Since the remaining plugins/scripts of your webpage might require latest jquery, you could use the getScript() function to load the migrate jquery for only the pushmenu plugin! Therefore, you should probably use the code provided below for your requirement...
$(document).ready(function(){
$.getScript( "http://code.jquery.com/jquery-migrate-1.2.1.min.js", function() {
$.getScript('js/jquery.multilevelpushmenu.min.js', function() {
$('#menu').multilevelpushmenu();
});
});
});
I've posted here before but can't find my account so this is my new first post.
I'm attempting to use a js plugin called "blueberry slider" with a responsive js menu called "Menumaker" and something is conflicting, can't get the slider to show. I really don't know what I'm doing with JS yet, hoping someone can help. In Chrome, element inspection, it's saying "undefined is not a function". I haven't modified anything of the plugins.
I think your problem is probably that you're loading a version of jquery, adding a plugin to it, and then loading a new version of jquery and attempting to add a plugin to that, too. Pick a single version of jquery to include. You're including three:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
at the top,
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
just above your blueberry script, and
<script src="js/jquery-1.8.3.min.js"></script>
at the bottom just above your menumaker script.
The latest version of jQuery loads and overwrites your blueberry script's modified version of jQuery.
I suggest you just get rid of the last two and use the first version.
the function which you are calling and function present in your plugin library doesn't match , which is the reason it doesn't find any function named "undefined" in that library. Try checking the function name in it's documentation.
I have been styling a predefined site, and after adding some box-shadows last night my loopedSlider has stopped working.
I have installed a clean version of the template I am using alongside. The page in question is
scorpionhosting.net
and the clean template is:
scorpionhosting.net/cleanhostpay
I've been back through the CSS, checked the html and w3c validated both to double check it wasn't something obvious (closing tags etc). I notice that the clean template is using loopedslider.min.js while my page is not. I don't understand why this is, I'm afraid I don't speak javascript very well yet!
The clean version has jQuery 1.3.2 loading:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
Your new version has no jQuery.
The latest version of jQuery is 1.9.1, by the way, so I'd update for a new site. You may have trouble with your slider if you go that far, though, since 1.9 removed some deprecated methods. I'd try 1.9.1, and if it doesn't work, try 1.8.3.
I'm building a website which use Nivo Slider. At first, it worked nicely. But yesterday, when I tried again, it's suddenly stop moving. I haven't changed anything yet before I discovered this issue. I looked into the console and there is a javascript error which says:
Uncaught TypeError: Object [object Object] has no method 'live'
When I tried to look into jquery.nivo.slider.js, the error is on $('a.nivo-prevNav', slider) like below:
$('a.nivo-prevNav', slider).live('click', function(){
// function's content
});
Using google's inspect element feature, I search into the page and found there.
What is wrong with that? why it is suddenly stop moving? Any help would be appreciated.
The Nivo Slider needs jQuery to work. On your website you refer to jQuery like this
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
This is pretty dangerous, as the latest version constantly changes. As can be seen from the jQuery documentation at
http://api.jquery.com/live/
the live function is deprecated since jQuery 1.7. Looking at the unminified jQuery source at
http://code.jquery.com/jquery-latest.js
it seems like the function is not there anymore, which is why you get the error.
Solution: bind jQuery with a specific version - probably you can find out which version you need from Nivo Slider documentation. Some of the older versions of jQuery can be found here: http://jquery.com/download/
In jQuery version 1.9, which it looks like you're using, the live() function is actually deprecated: http://api.jquery.com/live/
I guess you may have to wait for Nivo to update their source to support the latest jQuery, you can go down to jQuery 1.7, or modify the Nivo source yourself.
There is now a new version of Nivo Slider (3.2) that uses .on instead of .live.
Or use an older version of jQuery (1.7.1 is working for us)
Replacing all the .live() with .on() in the nivo slider's js file worked for me. My jquery was version 1.9.1 .
I found the jQuery Gallery View plugin because I was looking for a good way to cycle through pictures including text and one that was well designed. This plugin does not seem to be updated anymore and does not have much documentation so I am having difficulties implementing it. Does anyone have an idea as to how it works?
Thanks in advance for any help you can give.
Heres the code I have now (of course with the pictures at the right locations just not possible to attach in jsfiddle): http://jsfiddle.net/chromedude/GgusY/
Here's a start.
I'm taking a total guess at what your markup is supposed to be, because you were missing a bunch of </div> (close div) tags.
Things I had to change to get it this far:
Download galleryview-2.1.1.zip, and from that file...
Paste in contents of galleryview.css and jquery.galleryview-2.1.1js into the fiddle (normally you'd do this with proper external scripts and stylesheets)
Fix the markup so that all those <div class="panel"> tags are properly closed
Get a copy of jquery.timers-1.1.2.js onto the page
Step 2: got the loader image working by hosting the loader.gif file on imgur and editing the CSS accordingly.
Themes are tougher, because apparently, this genius™ plugin tries to figure out where your themes are hosted based on the location of the <script> tag which was used to load the galleryview plugin code. Absolute genius... </sarcasm>
Check it out →
no more image 404s. Loaded next.gif, prev.gif, panel-nav-next.gif, and panel-nav-prev.gif onto imgur so that jsfiddle can actually get the images.
I had to actually edit the plugin source for this one; if your server has the directory structure that galleryview expects, this should not be necessary.
Now here's the thing
You could keep wrestling with this plugin.
Or, you could use a different one, like Galleria. As far as I can tell from the example you've been trying to assemble, Galleria does all the same stuff. Since Galleria is actively maintained, you should actually be able to use it with a reasonably recent version of jQuery, as well as actually get support for it from the developer.
Get the latest version of jquery gallery view here:
http://plugins.jquery.com/node/7317/release
Then following on from that:
http://jsfiddle.net/chromedude/GgusY/
$('#photos .filmstrip').galleryView({
panel_width: 800,
panel_height: 300,
frame_width: 100,
frame_height: 100
});