柒侠伍义
发表于 2017-10-23 14:24:03
主题:swiper幻灯片初级教程2018_柒侠伍义
作者:柒侠伍义(李易俸)
国家:马来西亚槟城
邮件:jh7x51@gmail.com
网站:liithong.com mt4ea.com mt5ea.com
面子书:facebook.com/liithong
版权保留 请勿转载
第10章:字体颜色问题
注意!注意!注意!
弄幻灯片我们要注意的细节太多了
也要考虑顾客观看的效果
我们来看看这张...
注意字的颜色和图片的颜色相近或吃眼力或刺眼
和这张比...8的不会刺眼
第7幻灯片字体颜色和照片
不符合颜色光学
无论我们换什么颜色或
无论我们换什么图片都会有1或2张
的图片和字体颜色相近
有一个办法可以解决这个问题
就是在字体上加《阴影》
css 是这样
text-shadow: 3px 3px 3px #000000;
我们就创造一个css
专门给字体用的吧!反正....
比如这样
.字体{
position: absolute; /*字体漂浮*/
text-shadow: 3px 3px 3px #000000;/*字体阴影及颜色*/
line-height: 10px; /*字体之间空隙*/
}
.大标题字{
font-size: 500%; /*字体大小*/
color: #FFFF00; /*字体颜色*/
}
.小标题字{
font-size: 300%; /*字体大小*/
color: #00FFFF; /*字体颜色*/
}
这回你自己加....
哈哈和....
010(未完)
柒侠伍义
发表于 2017-10-23 14:34:30
本帖最后由 柒侠伍义 于 2017-10-23 14:35 编辑
主题:swiper幻灯片初级教程2018_柒侠伍义
作者:柒侠伍义(李易俸)
国家:马来西亚槟城
邮件:jh7x51@gmail.com
网站:liithong.com mt4ea.com mt5ea.com
面子书:facebook.com/liithong
版权保留 请勿转载
第11章:键盘操作←→
是人都有欲望
欲望是无穷无尽的...
幻灯片制作已经差不多了
可以了....
但 发现有些幻灯片是可以在键盘操作左右的
这个功能swiper有吗?
哈哈和...
好的。非常简单
在下方...
<!-- Initialize Swiper -->
<script>加上...
**** Hidden Message *****
就可以了
试一试看看...
是不是可以了
哈哈和...
011(未完)
柒侠伍义
发表于 2017-10-23 15:06:54
主题:swiper幻灯片初级 教程2018_柒侠伍义
作者:柒侠伍义(李易俸)
国家:马来西亚槟城
邮件:jh7x51@gmail.com
网站:liithong.com mt4ea.com mt5ea.com
面子书:facebook.com/liithong
版权保留 请勿转载
第11章:更换幻灯片时出现特效
看到没?
当手动或滑鼠拉动幻灯片
就看到下一张幻灯片是暗色一点点的
然后有暗变明...
是不是 很爽~~~
哈哈和....
添加3行源码就可以办到...
opacity:0.5; /*更换幻灯片时出现特效*/
transition: opacity 3s ease-in-out; /*更换幻灯片时出现特效*/
opacity是透明度,调整去0.7也不错
3s 是有暗到明,历时3秒
可以换去1s,也是可以的
还有添加一个幻灯片激活后的透明度
当然透明度要放 1 ,就是没有透明度
.swiper-slide-active{
opacity:1; /*更换幻灯片时出现特效*/
}
看了,爽了一点点 是不是....
哈哈和...
下载完整源码:
012(未完)
thundersword
发表于 2017-10-24 09:55:21
:victory::victory::victory:
wangvsshen
发表于 2017-10-24 16:20:50
这教程看的一点也不无聊,真的不错
wangvsshen
发表于 2017-10-24 16:23:39
...................怎么看一个都要回复一次
clan
发表于 2017-10-25 17:21:01
通俗易懂哈
柒侠伍义
发表于 2017-10-25 17:23:21
本帖最后由 柒侠伍义 于 2017-10-25 17:40 编辑
主题:swiper幻灯片初级 教程2018_柒侠伍义
作者:柒侠伍义(李易俸)
国家:马来西亚槟城
邮件:jh7x51@gmail.com
网站:liithong.com mt4ea.com mt5ea.com
面子书:facebook.com/liithong
版权保留 请勿转载
第13章:更换滑动比率
刚刚正欣赏幻灯片
发现手机滑动好迟钝...
要拉到一半(50%)的画面才去下一张
不好...这样不好
最好,拉10%啊 5%啊就可以跳第2张
这样还差不多...
嗯,不错,ORIGINAL的就是这样
我们来改一改
简单罢了
添加....copy && paste 下方java 就可以
//--------------滑动触发事件----------------------------------//
**** Hidden Message *****
//--------------滑动触发事件----------------------------------//
嗯!现在试一试你的幻灯片
手动或滑鼠拉10%画面就跳第2幻灯片啦
爽吗?哈哈和...
013(未完)
柒侠伍义
发表于 2017-10-25 17:39:34
主题:swiper幻灯片初级 教程2018_柒侠伍义
作者:柒侠伍义(李易俸)
国家:马来西亚槟城
邮件:jh7x51@gmail.com
网站:liithong.com mt4ea.com mt5ea.com
面子书:facebook.com/liithong
版权保留 请勿转载
第14章:鼠标选择文本
如何在Swiper页面中禁止鼠标拖动,
同时能够用鼠标选择文本?
嗯 好的。
简单...copy & paste 下方java 就可以了
//-------------------------//
**** Hidden Message *****
//-----------------//
是不是可以了
滑鼠拉不懂画面了
而且可以选择文本
可以copy文本啦~~~
哈哈和....
是不是很简单
哈哈和...
014(未完)
zheng490907365
发表于 2017-10-25 23:49:50
顶lz!!!!!!!!!!!!!!!!!!!!!!!!!
页:
1
[2]
3
4
5
6
7
8
9
10
11