使用交互面板中的设置项给网页元素添加各种效果

选中网页中任何一个插件后可以在右侧看见一个交互面板,使用交互面板中的设置项可以给网页中的插件设置各种动态效果,如:在鼠标点击插件,移动到插件上方或移出插件后可以隐藏页面中的插件,显示插件,改变插件位置和大小等。

具体的效果触发动作和可以实现的效果如下图所示:

交互效果的设置流程是:a)选中页面中一个页面插件或布局 > b)去交互面板中选择一个触发动作 > c)在触发动作下方添加事件,即选择一种元素效果 > d)在弹出的窗口中元素ID设置项中填入元素效果将会起作用的对象的属性ID > e)在设置窗口中设置其他元素样式,如隐藏/显示,改变元素位置等。

如果要在网页中做点击一个插件,另一个插件就被隐藏的这种效果的话。就需要先获取将要被隐藏的插件的属性ID。获取的方法是在此插件上点击,然后在右侧属性面板中复制此插件的属性ID。

然后选择将要被点击的插件,并在右侧的交互面板下方选择触发动作,这里的触发动作是鼠标点击,所以就在鼠标点击下方选择隐藏元素的效果。在弹出的设置窗口中的元素ID设置项中粘贴刚才复制的插件属性ID。

你还可以设置是否添加动画效果以及使用哪一种动画效果。

这样,当用户在网页上点击a)中的插件或布局的时候,被复制属性ID的插件就会被隐藏起来。这就做到了让用户和网页中的一个插件交互,影响另一个插件的显示/隐藏状态的效果。

 

这里需要注意的还有几点:

1.  在触发动作中鼠标移入指的是用户将鼠标移到插件的上方,鼠标移出指的是用户把鼠标从插件上方移开。

2. 显示元素隐藏元素不难理解,就是指用户和页面中的一个元素发生交互<点击移入移出>的时候,其他元素或这个元素本身显示或隐藏起来切换元素可见性指的是元素效果随着触发动作的多次执行在显示元素隐藏元素之间交替发生。例如,如果触发动作是鼠标点击的话,那么当鼠标第一次点击a)中的插件的时候,被复制属性ID的插件如果默认在样式面板中的显示状态中设置的是显示的话,那么随着鼠标第一次点击,这个<这些>插件会隐藏起来,第二次点击的时候这个<这些>插件又会显示出来,三次点击会隐藏,第四次点击会显示,如此反复切换。

3. 在样式面板中给某个插件或布局在选中状态下方设置一种样式以后,当用户在网页上点击<选中>这个插件以后设置的样式不会起作用。这是因为网站管理员给这个插件或布局在选中状态下方设置样式以后,还需要获取这个插件或布局的属性ID,并在右侧交互面板中选择一个触发动作,在触发动作下方选择选中元素的这种元素效果。在弹出的设置窗口中粘贴复制的属性ID,这样当用户点击这个插件或布局的时候,在样式面板选中状态下设置了样式的插件就会把样式显示出来。在此基础上,在另外一个插件或布局上添加触发动作,选择取消选中元素的效果并在弹出的设置窗口粘贴被复制的插件或属性ID,设置好后用户点击这个插件,之前在选中状态下设置的样式就会隐藏起来。

4. 鼠标单击改变元素位置和大小的效果中可以设置让用户在单击,移入或移出的时候其他页面插件的宽度和高度变化。

移动位置:可以让页面中的插件或布局在网页中移动位置。如果移动到的位置上已经有插件或布局的话,被移动的插件或布局会居于此处原有插件或布局的上方。

改变填充:改变插件或布局的内部填充。

改变间距:改变插件或布局的外部距离。

5. 这种效果一般运用在页面插件或布局有重叠的情况下。这样当鼠标单击,移入或移出某个插件或布局的时候,其他的插件或布局的层级发生变化。

6. 这里的改变内容目前只有文字,即用户单击,移入或移出某个插件或布局的时候,其他插件或布局变成这里设置的文字。

7.  只有当网页内容高于浏览器窗口高度的时候,网站管理员可以设置让用户点击浏览器窗口第一屏中的某个插件或布局跳转到浏览器窗口第二屏的网页内容中的某个插件或布局上。

使用手册文章列表和详情,突唯阿帮助支持中心,突唯阿帮助支持中心

使用手册文章列表和详情-突唯阿帮助支持中心

使用手册文章列表和详情,突唯阿帮助支持中心