Trying to use Mobile Framework: Gliders in my web application - javascript

I'm currently trying to adapt my currently in-development jquery-mobile web application to use the navigational structure from this mobile template called Gliders, and I'm having some issues.
http://www.enableds.com/products/gliders/
I've been following their FAQ in order to incorporate the page structure, as well as the left sidebar in an attempt to get their navigational structure working, but I keep getting the following error in tons of my scripts:
$ is not a function
This is what was happening when I kept my current version of jquery in (which is 1.11.3); and when I switched to their version (which is 1.8.2), I get this error:
$(...).sketch is not a function
Though even if I comment my sketch functions out, the left sidebar isn't showing up at all.
Does anyone have experience with using templates like this?

Looks like it was because I was using a different version of jQuery than the version that was in the application.

Related

Typo3 - t3jquery integration is not working

so first i have to say that i'm realy new to Typo3, so i dont rly know much about the cms.
Actually i have a Problem with my Page.
I want to integrade a Image Slider in my Page with the Nivo Slider Plugin.
The Problem is, that the Slider is not shown.
The page gives the error
TypeError: jQuery(...).nivoSlider is not a function
so i think, there is some problem with the jQuery.
For that i installed t3jquery but its still not working.
i nearly tried every configuration for t3jquery and also analysed the other extensions on my Page with the plugin, but nothing works.
Some of you have advice what i can do?
The page is hxxp://www.eventbringer.de/skireisen/opening-slider/ (so you can see the error in the JS Console)
TYPO3 has a very versatile way of getting content of code to the front-end.
One way is to use typoscript.
read : https://docs.typo3.org/typo3cms/TyposcriptReference/
You can see typoscript as a huge configuration 'array' that can declare all sorts of settings.
One of the settings is about how the 'page' itself needs to have.
If you need, for example, some javascript in your page, you could use
page.includeJs
https://docs.typo3.org/typo3cms/TyposcriptReference/Setup/Page/Index.html#setup-page-includejs-array
if you need yous JS at the footer, and its an external lib, you could use
includeJSLibs.twitter = http://twitter.com/javascripts/blogger.js
includeJSLibs.twitter.external = 1

Can't get javascript to execute in a dojo contentpane even with dojox

I've seen other posts about getting javascript to load in a dojo contentpane by using the dojox extension. However, I can't seem to get this to work in my scenario.
To make it easy to replicate, I'm using the example app here:
http://demos.dojotoolkit.org/demos/parserAutoRequire/
Basically I just want to be able to run javascript in one of the loaded tabs (divs). I've tried changing dijit to dojox everywhere a contentpane is referenced by this isn't working and has been driving me mad...apart from this it's all working great!!
Any suggestions will be greatfully recieved!!!
You should try getting an object of content pane in javascript and then executing the code on that object.
dijit.byId("ContentPaneId")
should return you the object to your content pane.

Compatibility between Foundation and WordPress Javascript

I am creating a WordPress theme. I have finished the design using Zurb's Foundation as my framework. Everything was going swimmingly until I hit a snag with what I think is Javascript.
Please take a look here:
http://dev.andrewtanner.me/wordpress/
Two problems:
The masthead image (specifically the word 'Napier') is not rendering beneath the fixed navigation top bar.
When scaling down to smaller devices, I expect that clicking the hamburger would call the menu but this isn't happening.
You can check out the design here (just the framework, nothing else):
http://dev.napiercountryfestival.co.nz/ - No problems at all here so the JS etc is all good.
I do believe this problem resides with JS as when I use Dev Tools I am met with two errors:
Uncaught TypeError: undefined is not a function
Uncaught ReferenceError: foundation is not defined
I know Foundation relies upon JS for elements within the navigation bar, particularly if it is fixed like mine is.
I would like to know how to best approach this with WordPress. I have checked out the Codex and tried their solution concerning calling the JS located here but to no avail http://codex.wordpress.org/Using_Javascript
I have also tried calling WordPress' jQuery using <?php wp_enqueue_script("jquery"); ?> instead of Foundation's but no luck either - it makes no difference. Could it be than I'm not calling things in the right order in the DOM?
I do have a couple of smaller JS scripts, one for running the marquee and another for the countdown located beneath the masthead and I'm not experiencing any problems with these (unless I kill the dependency to Foundation's jQuery by messing around trying to get things working).
Any help you can offer would be much appreciated - thanks!
Fixing Foundation to be a function is easy. Open your app.js file and re-write it to look like this:
jQuery(document).ready(function ($) {
$(document).foundation();
});
You have two jquery files in your head tag. Remove one of them it will fix your hamburger menu issue
your masthead goes below the nav bar because you have a class fixed which has a property of position:fixed.
in the other link you have provided you have a class .f-topbar-fixed on body tag which provides padding-top:99px; which pushes your page down resulting in the visibility of your masthead. Add the class as well as the styles defined it will fix the masthead

(Foundation CSS) Dropdowns are not working

So dropdowns aren't working when using foundation (not even the code copy-pasted from the foundation docs).
This Html is generated using Play! Framework, and I am viewing it using chrome. This code is running on Localhost, not a foreign server. (Maybe chrome is blocking js on localhost or something?)
The following is the code I'm using. Any help would be appreciated.
JSFiddle: http://jsfiddle.net/U7CZq/
code
There are a couple things that I see here that could be causing problems.
The first major issue is you are not including foundation.topbar.js file, which is needed to implement the dropdowns.
The other issue is you should call $(document).foundation() at the bottom of the page to allow foundations javascript components to manipulate the DOM of the topbar to add the proper elements and classes need for the topbar dropdowns.

cordova.exec() is breaking my app code

I am developing an Ipad app with HTML5, Javascript/JQuery Mobile and Cordova/Phonegap. One of its features is to build and send an email, I am doing this using EmailComposer, the problem is that after the emailcomposer's screen runs and I return to the app, many of the list views (generated by Jquery Mobile) stop working.
Debugging I found that this happens when the function cordova.exec() runs. I tried to pass empty args, thought that maybe something were conflicting but the problem persists.
cordova.exec(null, null, "EmailComposer", "showEmailComposer", [args]);
Any idea of what could be causing this?
I don't think the issue is to do specifically with cordova.exec - that is just the method call for any native functionality.
Sounds more like part of your view is being redrawn and not getting enhanced by jQuery Mobile. You can trigger the create or refresh events on jQuery Mobile when you return to your app.
See the section on updating lists at the bottom of this page http://jquerymobile.com/test/docs/lists/docs-lists.html
I also faced the same problem, but now I solved it:
In "cordova.plist" write Key:EmailComposer and value:EmailComposer.
That's it!

Categories