开发工具与关键技术:DW ,     css3js jquery.

作者:吴维杰

撰写时间:2019116

做一个简单的祝福对联来总结技术,首先构建一幅对联的框架,在框架中写上一些简单的样式,如下截图。(html)

《css3、js 、jquery在应用于一个小功能上的多种实现》《css3、js 、jquery在应用于一个小功能上的多种实现》


《css3、js 、jquery在应用于一个小功能上的多种实现》《css3、js 、jquery在应用于一个小功能上的多种实现》

方法一、运用css3的动画来实现缓慢显示效果;(css3)

优点:简单明了的几句代码就实现缓慢显示效果

缺点:实现的效果是利用了一些小技巧,先要让字体为透明色,然后让字体为窗体的背景颜色看上图红线),如果两种颜色不能前后配合,那么就会出现其他的效果。


《css3、js 、jquery在应用于一个小功能上的多种实现》《css3、js 、jquery在应用于一个小功能上的多种实现》


方法二、运用js 实现缓慢显示效果;(js)

方法总结:设置外部的框架高度为0,然后让字体隐藏起来,再用js实现高度的改变,在上图中运用了一个定时器来让动画延迟一秒钟后实现(蓝框内容),最后设置高度的改变为一秒钟内匀速完成缓慢显示效果。(看上面截图)


《css3、js 、jquery在应用于一个小功能上的多种实现》

《css3、js 、jquery在应用于一个小功能上的多种实现》《css3、js 、jquery在应用于一个小功能上的多种实现》

《css3、js 、jquery在应用于一个小功能上的多种实现》

方法三、运用jquery实现缓慢显示效果。(jquery)

方法总结:与js的方法大同小异,首先载入jquery库,众所周知jquery库中的代码都已经封装好的,只需要把想要的效果按它给定的方法写入即可,在很多项目中能高度有效的达到目的。但相应的基础会不太扎实。

总结:一个效果可以用多种方法来实现,在编程中就应该灵活的运用所学的知识,去编译出想要的结果,拥有更多的想法去玩转这些代码。

 

 

 

 

 

 

 

 

 

 

相关文章: