- This topic has 5 replies, 4 voices, and was last updated 11 years, 3 months ago by
.
-
Posts
-
Hello,
I’m trying to integrate plugin from this link in my app:
http://flipclockjs.com/faces/hourly-counter
Below is my code:
<html> <head> <link rel="stylesheet" href="css/flipclock.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="js/base.js"></script> <script src="js/flipclock.js"></script> <script src="js/dailycounter.js"></script> </head> <body> <div class="clock" style="margin:2em;"></div> <script type="text/javascript"> var clock; $(document).ready(function() { // Grab the current date var currentDate = new Date(); // Set some date in the past. In this case, it's always been since Jan 1 var pastDate = new Date(currentDate.getFullYear(), 0, 1); // Calculate the difference in seconds between the future and current date var diff = currentDate.getTime() / 1000 - pastDate.getTime() / 1000; // Instantiate a coutdown FlipClock clock = $('.clock').FlipClock(diff, { clockFace: 'DailyCounter', showSeconds: false }); }); </script> </body> </html>I’m able to run this in browser, but when I put this up in my custom HTML and run the app, it’s all blank.
I’ve put up the required js files in www/js/ folder.
Please help.!Mobione includes head tags and that.
Your best bet is to remove the head and html tags and add the javascripts using the project properties. You should have no problem with using plugins if you do that. I have tested several of them.Hi,
As CincyPlanet said, you should add your javascript files using as Javascript libraries in your startup screen, see: http://www.genuitec.com/mobile//docs/highlights/2.2.0/#sec2
Also, note that we don’t officialy support 3rd party plug-ins, so your mileage will vary depending on the compatibility of the plug-in you’re going to use.
Thanks for the replies CincyPlanet and SupportOctavio.
I had JS and CSS files for the plugin, and as per you said, I added those to Startup screen’s JS libraries.
And added this piece of code to custom HTML:<div class="clock"></div> <script type="text/javascript"> var clock = $('.clock').FlipClock(3600); </script>without <html> and <head> tags.
Still it’s not displaying anything.I want to add this to my mobile app:
http://flipclockjs.com/faces/hourly-counter
Please, if feasible, provide step by step instructions, as I’m a complete newbie here.
Note:
Is there any jQuery version restriction to be used with Mobione?
I’m using jQuery Mobile 1.4.2 right now.Hi,
We do not test for compatibility between mobione’s phoneui framework and widgets and those of any other framework including jquery mobile. Some of the other developers that have experimented with such integrations may be able to assist.
Hi pratiti,
The plugin will work in mobione, see the attached example. Its a very quick and dirty example but it runs in the simulator. I have not gone through the API to find out how to resize and and fire the callbacks but it runs.
I would make sure it runs on your target device as I have had it in the past where plug-ins work in chrome but not on the device.
Thanks
Paul
