Touch scrolling in durandal + phonegap - css

I'm new in this kind of development, so maybe this is a basic question.
I'm developing a new SPA using DurandalJS. Everything works fine in the browser, so I try to build an app using Phonegap Build service. So I install the resulting apk in my mobile and it works, but I've got not scroll at all.
First, I've tried setting css properties as overflow-y:scroll and -webkit-overflow-scrolling:touch, but it didn't help (or i don't know how to make it work...)
Next I've read about iScroll plugin. I tried to use it but I can't manage to get it work, i can't notify to the iScroll object when DOM is updated (i believe).
Is there a way to accomplish the vertical scrolling in this kind of app?

In short: Remove app.adapteToDevice if you're planning to use Durandal with phonegap.
See https://groups.google.com/forum/#!searchin/durandaljs/scrolling for more info.

Related

How to create an interactive timeline (example site: https://evianexperience.com/en) using SVG - in WordPress

I am creating a website in WordPress and I am using DIVI theme.
I need help to create an interactive timeline for a project. The example site is: https://evianexperience.com/en. This is the exact thing I want to implement.
Please see me web layout (https://snag.gy/IKF13r.jpg) to get an idea, what actually I need it for.
I have tried to use Interactive Storytelling (https://tympanus.net/codrops/2015/12/16/animated-map-path-for-interactive-storytelling/) but it didn't worked either.
You could try scroll magic, seems to have plenty of features to achieve what you need.
http://scrollmagic.io/
Also I think skrollr will still work but it's pretty old
https://github.com/Prinzhorn/skrollr
If you need exactly what they have, looks like they are using some product called greensock, probably even this module: https://greensock.com/drawSVG and also ScrollMagic to control the animation by scrolling. A tutorial I found online with different animation https://ihatetomatoes.net/svg-scrolling-animation-triggered-scrollmagic/
I don't think you could do it with Divi alone, you can definitely try just some scroll plugins which are free. Otherwise you could see if greenstock's free/business license works for your project.

add animation to already created asp.net app

Hi i have already created my asp.net app and its running perfectly except we recruited a new member and he started on this new app and he is using bootstrap animations and templates and all... while i didnt i used css myself cause i tried to personolise it just like they want any way now my boss was amazed with what bootstrap can do an all and now i want to add transitions and cool css,ajax stuff to my app any links or methods to help please im BURNING INSIDE.
please help
In case you need to update your project to use boostrap, then you need to move all the styles you added to a stylesheet file, and call them as needed (that is separate from bootstrap, just to make it more easy when you need to change styles). Besides that, if you want to use Bootstrap, it's simple, just add the boostrap files (styles, JS) and then use them as explained in the Boostrap website. Also, you can customize them as you want, but those components and classes will make the magic to make your website compatible with cross browsing and devices.
http://getbootstrap.com/getting-started/
Hope that helps!

Is there any way to make Brackets' Live Preview feature work on Meteor projects?

I am styling a project built on Meteor and using LESS. I use Brackets for styling because its Live Preview feature makes working with CSS a lot quicker and more pleasurable, but by Meteor's nature it doesn't seem possible to use this feature.
Every little change I make on the code has to be detected by Meteor, who will in turn refresh the project on the browser for me, and this process is now taking anything between 5 and 10 seconds, which is entirely too much.
Does anyone know if it's possible to work on "live" CSS/LESS, using Brackets, in a Meteor project, without having to wait for Meteor to notice my changes and take its sweet time to refresh the whole thing for me?
Or at the very least least if there's anything I can do to shorten the time Meteor takes to update?
I don't think it is possible unless the developers of Brackets go an extra mile and implement a specific support tailored for Meteor.
Brackets works on top of raw CSS and HTML files and uses Chrome Dev Tools API to manipulate the page.
Meteor doesn't send raw files to the client. HTML templates in Meteor get compiled to JS DSL and CSS is concatenated and sent in a manipulated form, too.
Bracket's live preview feature would work only with quick page layout prototyping and will not play well with any modern front-end tool chain that involves compiling pages and stylesheets or preprocessing.

How to make emberjs app with a mobile look (like the one in jquery mobile)?

I have a simple project of a web application for mobile using Emberjs. For the look and feel, I want something equivalent to JQuery Mobile. Is there a way to mix Emberjs and jquery mobile? If so, how?
I have looked at the Travis-ci mobile app and they seem to have only defined a specific css for the mobile version. What is strange is that they also have this file : file that seems to be an attempt to integrate with JQMobile but they don't use it anywhere in the code.
I also have found this article Using Ember.js with jQuery UI but it's about JQuery UI. Can I use the same technique for JQuery Mobile?
Please share your own experience about having a mobile look and feel with Emberjs.
If you know any open source project on GitHub or wherever that uses Emberjs for mobile I will be thankful if you let me know the address.
What Technique do you recommend?
Note: I have make a first attempt to use the 'data-' html5 attributes of jquery mobile within a list generated by a controller but the elements of the view don't have change to a jquery mobile look and feel and I not sure why.
Sorry for my English, it is not my mother tongue.
As stated in the Ember.js wiki there are two projects concerning mobile:
ember-titanium - Titanium Mobile wrapped in Ember (formerly SproutCore-Titanium)
ember-mk - Mobile Kit for ember.js
Maybe they are useful for you.
#luissala created a proof of concept project using Ember with jQuery Mobile. It might get you on the right track:
https://github.com/LuisSala/emberjs-jqm
Have a look at Twitter Bootstrap: http://twitter.github.com/bootstrap/
https://github.com/fohr/blossom
Is in a very premature state, but it seems pretty promising.
It's from the guys who started Sproutcore (I think!), so the syntax is very relevant to EmberJS

Is Flex Label baselineshift supported on mobiles?

I need to create subscript text for mobile. I read at http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/components/Label.html that label's baselineShift property is not supported on the mobile theme. So I created a plain mobile project using the default mobile theme with a couple of test labels and in the FB 4.5 emulator the baselineshift worked fine.
Why then do they say that it's not supported? Is there anything to stop me going ahead and using it?
It doesn't sound like here is anything to prevent you from using it. When something like this isn't "supported" it generally means that Adobe is afraid of performance issues that may result in using this.

Resources