bfcad1 发表于 2014-10-22 00:39:02

【请教】滚动页面切换内容 滚动窗口 鼠标滚动 全屏滚动

大家好
想請問使用axure要怎麼製作出「用滾輪往下滾切換到下一頁」的效果
用dynamic panel試了好久試不出來
網頁範例如下:
http://www.ford-event.com.tw/#1
還請不吝賜教,謝謝!

尹广磊 发表于 2014-10-22 15:28:34

axure里没有鼠标滚动的触发事件,有窗口滚动时的事件,但是功能有限,
直接想用滚动鼠标就做出这样的效果用axure还做不出。

但是,用在面板上,上下拖动的方式可以做出这样的效果。
需要借助鼠标坐标点的变化来判断是向下拖还是向上拖。




演示效果:

rp源文件:

bfcad1 发表于 2014-10-22 22:02:55

謝謝您的回覆與提供的範例,受益良多!
不過有在網路上也找到這個範例(如下方連結),看起來不是用鼠標滾動的觸發事件,但卻有類似的效果
仔細看其中有使用一些看不懂的語法,像是:
]、[(Window.scrollY/Window.height).tofixed(0)+1]]
如果您看了之後有任何想法還請指教,謝謝!

https://www.dropbox.com/s/lfuiyboudyviyi0/%E6%BB%9A%E8%BD%AE%E5%88%87%E6%8D%A2%E9%9D%A2%E6%9D%BF%E7%8A%B6%E6%80%81.rp?dl=0

尹广磊 发表于 2014-10-23 14:40:46

嗯,这种方法不错。

Move (Hot Spot) to (0,[])
是让左上角的小热区移动到一个页面下方的坐标位置,
这是为得让页面撑长,这样窗口才会有滚动条。
其中Windows.height是axure里可以使用的函数,调用窗口的高度。


其中if "[[Window.scrollY" is less than text on (Shape)
是判断窗口滚动的距离是不是小于矩形的高度,其中Window.scrollY是窗口滚动距离的函数。


其中[[(Window.scrollY/Window.height).tofixed(0)+1]]
是总滚动距离除上窗口高度,以计算滚动超过了几屏,
其中的tofixed(0)是其中除后结果的整数位。参考链接

老许1859 发表于 2015-3-13 11:10:23

if 部件文字 (形状) = "状态一"   这个状态一是哪里来的,没有这句话,页面也没办法滑动

老许1859 发表于 2015-3-13 11:13:29

针对的是鼠标滚动效果,其他地方的语言都了解了,就这个搞不懂

老许1859 发表于 2015-3-13 14:05:05

这个状态一,就是页面里面的图形,有点懂了

smor 发表于 2016-6-25 18:59:19

我说下我的思路:
可以将动态面板的大小调整得超过界面显示的范围,然后显示出垂直滚动条,里面放一个超过动态面板范围的透明矩形,然后设置动态面板对应的滚动事件;
这样做的用意就是让动态面板能够有滚动条,因为只有有滚动条的动态面板才能滚动,同时为了不让这个滚动条影响界面的视觉(比如说加上主窗口的滚动条会出现双滚动条),调整动态面版的范围超过界面视觉窗口的范围,就能起到隐藏动态面板滚动条同时触发滚动事件的效果;

我做的实例是用滚动鼠标来切换一个矩形区域的显示/隐藏,完美符合预期,所以这个做法应该是有可行性的;
页: [1]
查看完整版本: 【请教】滚动页面切换内容 滚动窗口 鼠标滚动 全屏滚动