0

Endless scrolling in Safari and Chrome

asked 2012-03-14 02:39:13 +0800

martelli gravatar image martelli
18

Hi,

I'm developing with ZK on a Mac (Lion). When a Window is set to "modal" or highlighted", the same page on Safari and Chrome allows me to scroll down indefinitely. The same does not happen under Firefox. I tried this by setting up a page with a single Window, no composers, nothing. Any other Window mode works fine.

Can anyone else confirm? Any clues on how to fix?

Best Regards,

Leandro

delete flag offensive retag edit

9 Replies

Sort by ยป oldest newest

answered 2012-03-14 03:58:51 +0800

martelli gravatar image martelli
18

<?page title="win" contentType="text/html;charset=UTF-8"?>
<zk>
<window title="Hello World!!" border="normal" width="200px" position="center" mode="modal">

<label value="You are using: ${desktop.webApp.version}"/>

</window>
</zk>

link publish delete flag offensive edit

answered 2012-03-14 04:10:51 +0800

henrichen gravatar image henrichen
3869 2
ZK Team

What do you mean by "endless scrolling"?

There shall not have scrollbar appear per your testing code.

link publish delete flag offensive edit

answered 2012-03-14 04:26:15 +0800

martelli gravatar image martelli
18

On the Mac, I can scroll by using two fingers. I guess it would be similar to using the mouse wheel.
I can scroll down and to the right indefinitely. On the Mac, even if your page does not scroll, you can displace the document a bit and it will get back to the original place once you release the touchpad. The effect is similar to releasing a spring (not the framework :P). Using Firefox the bug does not appear, but on Safari and Chrome, it's weird.

I can try to post a video on youtube, if it helps.

Thanks!

link publish delete flag offensive edit

answered 2012-03-14 05:09:46 +0800

henrichen gravatar image henrichen
3869 2
ZK Team

I am not familiar with Mac. It would be helpful if you can post a video.

link publish delete flag offensive edit

answered 2012-03-14 05:41:20 +0800

martelli gravatar image martelli
18

There it is:

http://www.youtube.com/watch?v=kIBuw_8uidA

What I'm doing is just scrolling with two fingers down and up.

link publish delete flag offensive edit

answered 2012-03-19 03:21:37 +0800

henrichen gravatar image henrichen
3869 2
ZK Team

updated 2012-03-19 03:24:25 +0800

OK. I see.

Modal window is actually consists of an out-most HTML <div> element with "absolute" position style. I guess the "endless scrolling" might be the "natural" of the Mac Safari behavior. It might beyond what ZK can control. To confirm this, just provide a regular .html page and style an div with position: absolute, proper border, and dimension; then visit with mac safari. Will know if it is mac safari's "unique" behavior.

link publish delete flag offensive edit

answered 2012-03-19 05:05:45 +0800

martelli gravatar image martelli
18

Hi,

Thanks for the reply. I tried the following HTML code:

<body>
        <div style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; border: solid red 4px;">OK</div>
</body>

But I behaves as expected on both Safari and Chrome and does not scroll indefinitely. I can drag and see the "spring" effect, but the page does not grow.

link publish delete flag offensive edit

answered 2012-03-19 10:26:48 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

@Martelli,

Can you try your example with latest ZK version (5.0.10)? and which safari version are you using?
From our environment, we test your example on Mac 10.5 with Safari for ZK 5.0.7.1 breeze version, and it works without the scrolling issue.
Here is my test case on ZK Fiddler.

ZKFiddle-Link

index.zul
<?page title="win" contentType="text/html;charset=UTF-8"?>
<zk>
<window title="Hello World!!" border="normal" width="200px" position="center" mode="modal">

<label value="You are using: ${desktop.webApp.version}"/>

</window>
</zk>

link publish delete flag offensive edit

answered 2012-03-21 03:11:34 +0800

martelli gravatar image martelli
18

@jumperchen

One thing we noticed is that this happens under Lion. My friend is still using Snow Leopard and it does not happen. After some experimentation, I found the following workaround:

<style>
.z-modal-mask {
        top: 0px !important; 
}
</style>

The only difference is the "!important", which manages to fix the bug.

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2012-03-14 02:39:13 +0800

Seen: 252 times

Last updated: Mar 21 '12

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More