华为云计算 云知识 网页如何设计图片走马灯效果
网页如何设计图片走马灯效果

网页如何设计图片走马灯效果?好看有趣的UI设计可大大提高用户的体验,华为云速 建站 在创建网站时,可使用内置插件快速实现图片走马灯效果,具体操作如下:

PC和手机版插件(适用版本基础版、标准版、营销版)

使用方法:进入网站编辑-〉点左侧插件图标-〉插件中心,找到走马灯插件图标,点启用,以下是操作流程图:

images_161127789458857

1、依次点击插件-我的插件-用鼠标左键选中走马灯插件并拖拽到您需要的位置

如果插件没有在“我的插件”中,请先到“插件中心”將插件启用。启用后在“我的插件”中,把插件拖到页面中应用。

images_161127795675096

2、设置走马灯的类型、方向、速度、样式及数据源。

images_161127798172825

(1)支持走马灯类型有:图片+文本,仅图片,仅文本;

(2)支持设置滚动方向:向左,向右,向上,向下。还可以自行设定滚动速;

(3)支持设置间距,图片宽度和高度,文本显示样式等;

(4)支持数据源自定义:可以自己添加图片和文本,也可以调用系统文章或产品数据。

3、添加展示数据。

1.自定义类型

点击增加选择需要的展示的图、如果没有直接点击上传即可、然后设置超链接和文本。

images_161127805396632

2.文章

images_161127807947453

注意文章详情页是指带有文章详情插件的页面,这里必须选择。

images_161127810583798

3.产品

images_161127812879925

注意产品详情页是指带有产品详情插件的页面,这里必须选择。

images_161127814496697

4、最后记得在右上角点击保存。

images_16112781872674

上一篇:智慧教学云平台教师使用手册-考试管理 下一篇:CDN如果被cc攻击是怎么处理的?

无服务器图片生成缩略图

无服务器图片生成缩略图