• Dreamweaver怎么设计一款拼图游戏?

    时间:2019-04-06来源/作者:靓女人品牌街8 编辑:源码库 文章热度:

    Dreamweaver中想要将一幅画分割成几份在框内进行拼图游戏;当靠近真确的拼图时自动吸附,该怎么制作这个动画效果呢?下面我们就来看看详细的教程。

     

    软件名称:
    Adobe Dreamweaver CS6 简体中文破解补丁(附官方主程序)
    软件大?。?/dt>
    1.2MB
    更新时间:
    2013-03-24

     

    1、在软件中新建一个页面点击创建

    Dreamweaver,拼图游戏

    Dreamweaver,拼图游戏

    2、点击-页面设置选择一张背景图片

    Dreamweaver,拼图游戏

    3、点击工具栏绘制边框

    Dreamweaver,拼图游戏

    4、选中边框-点击代码-重命名为bj-找到背景代码

    Dreamweaver,拼图游戏

    5、找到边框代码-删除默认样式颜色的边框代码

    Dreamweaver,拼图游戏

    6、选择输入边框样式和颜色代码

    Dreamweaver,拼图游戏

    Dreamweaver,拼图游戏

    7、在绘制四个边框设置为透明色

    Dreamweaver,拼图游戏

    8、按下shift键一次点击选中4个边框点击-修改选项-排列顺序-设置宽度相同-在进行一次设置高度相同

    Dreamweaver,拼图游戏

     

    9、一次打开分割好的四张图片拖拽只边框1、2、3、4

    Dreamweaver,拼图游戏

    10、拉两条 辅助线竖线对齐250。横线对齐标尺150处然后拖动图片拼成一副完整的图片

    Dreamweaver,拼图游戏

    11、点击边框1开始设置-拖动AP元素-自动获取当前位置-距离20个像素自动吸附,一次用相同的方法设置完4个边框

    Dreamweaver,拼图游戏

    Dreamweaver,拼图游戏

    Dreamweaver,拼图游戏

    12、打乱图片保存你就可以在浏览器中玩拼图了

    Dreamweaver,拼图游戏

    Dreamweaver,拼图游戏

    以上就是Dreamweaver制作拼图游戏的教程,希望大家喜欢,请继续关注ASPKU源码库。


    注:相关教程知识阅读请移步到Dreamweaver教程频道。
    相关Dreamweaver教程
    热门标签

    Dreamweaver教程Rss订阅Dreamweaver教程搜索

    十博体育_十博体育官网_十博体育app_十博娱乐_十博电竞_十博真人