Sencha Inc. | HTML5 Apps

Blog

Top Support Tips

April 30, 2014 | Sencha Support Team

Controlling the Scroll Indicator autoHide

by Mitchell Simoens

Sencha Touch has a scroller that works and looks the same across all platforms. Both axes (x and y, horizontal and vertical respectively) can have their own scrolling indicator, as you would expect, but are set to hide by default. In some cases, you may want to always show the indicators. New in Touch 2.3.0, each indicator has an autoHide configuration that allows you to control it. Setting autoHide to false will tell that indicator not to auto-hide. You can use the indicators config within the scrollable config on a Container or subclass.

For example, you can set the autoHide config to false for the y indicator. This makes the y indicator always show. Since the x indicator is left to its default, it will automatically hide.

You can see this in action at https://fiddle.sencha.com/#fiddle/1u9.


Mouseenter Versus Mouseover Event Listeners

by Seth Lemmons

In Ext JS, you can listen for mouse cursor events on a dom element in order to do things like add or remove a CSS class to said element. One event you can listen for is the mouseover event. However, the mouseover event will fire as the cursor enters the element in addition to passing the cursor over other nested elements. This can be aggravating if you only want the event to fire as the cursor first enters.

In this case, you should use the mouseenter event instead. This will allow you to monitor the cursor’s initial entry into the bounds of the element.

You can see this in action at https://fiddle.sencha.com/#fiddle/43q.

There are 4 responses. Add yours.

Hamza MHIRA

8 months ago

Reading each blog note and waiting for the facebook demo source code! I think two years for the announcement of the Html5 is ready but fastbook not yet available for the developers… Why we can’t learn from your source code to bring a very performant apps to user using sencha touch framework?

Ivan Jouikov

8 months ago

I love the use of Fiddle in these examples!

Michael Mullany

8 months ago

@Hamza - almost all fastbook improvements were in Sencha Touch 2.2 and 2.3 - embedded into the scrolling list component, and the animation queue. The only thing in the fastbook demo that isn’t in Touch right now is the iframe-based isolation, which we’ve decided is not the right way to do DOM isolation.

Ilan

7 months ago

The 1st demo doesn’t work for me - I just get errors in the console and nothing pitches up in the preview:
Uncaught SyntaxError: Unexpected token : app.js:1
Uncaught ReferenceError: doFiddleStuff is not defined

2nd one works.

Comments are Gravatar enabled. Your email address will not be shown.

Commenting is not available in this channel entry.