荷塘月色_淘宝抖音跨境电商卖家论坛社区

标题: C店详情页百变全屏背景固定 [打印本页]

作者: 黑骑士 时间: 2014-7-2 12:29
标题: C店详情页百变全屏背景固定
今天就来介绍下详情页中如何固定背景且是全屏的。虽然有部分亲在之前就已经会了，但鄙人喜欢分享。所谓：独乐乐不如众乐乐。附效果图一张：

下面附源码html模块内容：
<div class="hidden" style="display:none;">--C店详情页百变全屏背景固定 2014/05/29 小杜--</div>
<div class="footer-more-trigger" style="left:0;width:190px;top:-800px;padding:0;border:0;">
　<div class="footer-more-trigger" style="left:-390px;width:1920px;height:10000px;padding:0;border:0;top:0;">
　　<div style="width:1920px;background:url(http://img03.taobaocdn.com/imgex ... XX_!!1758846006.jpg) no-repeat fixed center top;height:100%;text-align:center;background-color:#f00;">请替换适合自己店铺的背景，背景色可以更换也可去掉，此处起便于观察作用！</div>
　</div>
</div>
复制以上模块内容后到自己店铺后台按照以下顺序操作。店铺装修→→默认宝贝详情页→→左侧新建一自定义内容模块→→点击源码后将复制的代码放进去→→保存--发布即可。此时大功告成，返回产品页面即可看到效果。至于如何达到“百变”的效果呢？按照以上步骤，新建多个详情页，按照不同的产品选择对应的详情即可。
下面说一些题外话，鄙站中也发表了一小部分关于淘宝店铺装修方面的内容，但时常在群里看到有些亲还是在提问一些有案例的问题，每当看到此时，鄙人的心都凉了。鄙人并没有歧视新人的意思，只是自己不加以思考的话，习惯了衣来伸手饭来张口后只会害了自己！下面仅以此文为例，用问答的形式来详细的进行剖析。
问题一：如何实现全屏？
答：无论是付费店铺还是未付费店铺均可使用官方的“footer-more-trigger”属性，此属性有什么作用鄙人就不废话了，装修过淘宝店铺的亲都懂得，无非是定位的作用而已！
问题二：为什么全屏后在不同显示屏下会偏呢？
答：全屏是全屏了，但并没有做到居中！不同情况下居中的方式不同，有时需要变通。例如此文章的居中就是不走寻常路的做法，有兴趣的亲可以按照自己的常规思路来实现看看。
问量三：这里的“left”的值为什么是“-390”呢？
答：回归第二问的结果。c店详情页主体部位是1140px；通常设置全屏时的宽度是1920px；那么旁白还剩下780px；旁白会分左右两边，对半分后便是390了。如果计算不出来的话，我只能哭着对亲说：“亲，你的数学老师一定中体育老师教的”

代码.txt (577 Bytes, 下载次数: 1057)

作者: 只愛→珊 时间: 2014-7-3 18:33
我试试再说

作者: 信誉才是富有 时间: 2014-7-3 18:33
学习努力

作者: 月影箫吟 时间: 2014-7-3 18:33
干货！

作者: 【美丽馆】 时间: 2014-7-3 19:05
111111111111111111111

作者: prvickey 时间: 2014-7-3 20:28
看看是什么好东西

作者: 儒雅 时间: 2014-7-3 21:36
支持你哈...................................

作者: 531520745@qq.co 时间: 2014-7-3 21:53
支持。。。。。。。。。

作者: 超超级猛男来 时间: 2014-7-4 01:11
为了荷币！

作者: 黄主席 时间: 2014-7-4 10:55
向楼主学习

作者: ˇ苏、泼鏝◥ 时间: 2014-7-4 11:54
希望有用有帮主

作者: zhangzechao 时间: 2014-7-4 12:48
111111111111111111111111111111111111111111111111111111111111111

作者: zhangzechao 时间: 2014-7-4 12:57
不能使用他人空间图片

作者: 许佳 时间: 2014-7-4 14:36
天天向上

作者: 淘宝软件销售 时间: 2014-7-4 15:42
麻烦，要回帖

作者: 陈艳州 时间: 2014-7-4 16:01
vvvvvvvvvvvvvvvvvv

作者: Lassen 时间: 2014-7-4 21:56
真的不错！

作者: 蝉翼的光泽 时间: 2014-7-4 22:44
学习下

作者: 罗明 时间: 2014-7-4 23:11
好帖学习啊

作者: 无情 时间: 2014-7-4 23:18
荷塘月色不错

作者: 一切随缘 时间: 2014-7-5 03:39
有空一起交流一下

作者: 潜泷-霴飞 时间: 2014-7-5 09:33
看年圻趎趎

作者: swqeeeee 时间: 2014-7-5 09:34
看看是什么

作者: 淡留茗香 时间: 2014-7-5 11:02
牛B的网站，我喜欢

作者: ALEX 时间: 2014-7-5 11:08
希望不是假的

作者: 黑山户外2014 时间: 2014-7-5 11:11
看看总是号的

作者: sjezh 时间: 2014-7-5 11:13
这个好我喜欢谢谢了

作者: 469590010 时间: 2014-7-5 13:47
看下哦谢谢楼主分享

作者: 厦门stone 时间: 2014-7-5 13:51
好好学习谢谢分享。。

作者: mrpan165 时间: 2014-7-5 13:54
不错这东西很好..............

作者: 小姿 时间: 2014-7-5 14:12
不错支持一个了

作者: 让人忘了季节 时间: 2014-7-5 17:59
当事人分割包围惹他给我热

作者: 可乐可乐了 时间: 2014-7-5 18:32
SADFDSAFFFFD

作者: 今夜有点冷 时间: 2014-7-5 18:57
C店详情页百变全屏背景固定

作者: 咨询4号 时间: 2014-7-5 23:16
希望不是假的

作者: )··( 时间: 2014-7-6 10:29
好好学习

作者: meagel 时间: 2014-7-6 12:09
真麻烦，老要回帖

作者: ※雪※ 时间: 2014-7-6 16:47
和楼主学习一下

作者: ぺ刪除葃兲． 时间: 2014-7-6 18:36
很期待。。。。。。。。。。。

作者: youpwer 时间: 2014-7-6 23:31
1111111111111111111

作者: lovexixi888 时间: 2014-7-7 01:03
不是吧，太强了

作者: 24小时刷实物 时间: 2014-7-7 05:39
希望能得到您的真传

作者: 魔法大变身 时间: 2014-7-7 11:21
麻烦，要回帖

作者: 爱像一道光 时间: 2014-7-7 14:37
荷塘月色论坛牛人真多

作者: 刷虚拟的M我 时间: 2014-7-7 17:33
不错支持下

作者: 晨曦 时间: 2014-7-7 17:50
谢谢，希望有用

作者: 宋程程 时间: 2014-7-7 19:59
必须要看看

作者: 雨沐清风216 时间: 2014-7-7 20:20
支持！

作者: 不熟路的熊 时间: 2014-7-7 20:22
非常感谢

作者: 天意があ 时间: 2014-7-7 21:57
我要赚钱啊

作者: 丫头！ 时间: 2014-7-8 01:11
看看吧谢谢分享

作者: 爱飞 时间: 2014-7-8 06:49
精品源于荷塘月色

作者: 姐.我钱莫了 时间: 2014-7-8 08:23
不错

作者: 第二个灵魂 时间: 2014-7-8 09:20
一直在看

作者: □(□)□ 时间: 2014-7-8 10:35
支持！

作者: Hey~boyづ厮守 时间: 2014-7-8 10:44
看看应该还不错

作者: 多情公子 时间: 2014-7-8 12:26
牛B的网站，我喜欢

作者: 勇气 时间: 2014-7-8 12:29
学习学习

作者: 我不是天使 时间: 2014-7-8 15:34
学习努力

作者: OOO 时间: 2014-7-8 16:57
感谢无私奉献

作者: 蔡月凤 时间: 2014-7-8 23:09
希望不是假的

作者: dalang_logi 时间: 2014-7-8 23:37
看看

作者: cutieangelz 时间: 2014-7-9 00:45
真实可靠？

作者: 优宝贝_9527 时间: 2014-7-9 01:01
希望有用

作者: 女人 时间: 2014-7-9 01:32
学习努力

作者: 神马庄园 时间: 2014-7-9 06:57
支持！

作者: 一眼万年 时间: 2014-7-9 08:11

学习学习~！

作者: 服装批发网 时间: 2014-7-9 09:08
非常感谢

作者: 卖快递单号 时间: 2014-7-9 11:28
学习学习了

作者: qiang0128 时间: 2014-7-9 11:35
牛人真是多

作者: zhoushi 时间: 2014-7-9 11:57
报道报道得得得

作者: 洅吔吥分开 时间: 2014-7-9 12:15
呵呵。。。

作者: 后知后觉 时间: 2014-7-9 14:51
0000000000000

作者: 活神的姘 时间: 2014-7-9 18:49
学习下

作者: 燕莎2015 时间: 2014-7-9 22:55
必须回帖

作者: 陈琳 时间: 2014-7-10 09:17
确实不错，顶先

作者: 祥云之茶 时间: 2014-7-10 12:13
希望有用有帮主

作者: 灵异贝贝 时间: 2014-7-10 18:51
还有效？

作者: Moment 时间: 2014-7-10 19:46

来荷塘月色论坛，学到了很多！

作者: 鑫光灿烂 时间: 2014-7-10 20:31
不是吧，太强了

作者: 没有伞的孩子要 时间: 2014-7-10 22:04
看一看吧

作者: ＂o畏:..?! 时间: 2014-7-10 23:38
看看

作者: 点击时代 时间: 2014-7-11 01:35
确定有效

作者: 实物3个10 时间: 2014-7-11 12:09
这个也能

作者: 吴奇鸿 时间: 2014-7-11 12:11
这个论坛真牛B

作者: 新普软件xpshop 时间: 2014-7-11 12:26
再接再厉

作者: 培凤 时间: 2014-7-11 19:19
感谢无私奉献

作者: 海浪 时间: 2014-7-11 21:20
支持！

作者: sgshop01 时间: 2014-7-11 23:18
我很想看看的呀

作者: hao999 时间: 2014-7-13 23:27
这个不错，谢谢楼主

作者: 南山上 时间: 2014-7-19 15:36

多谢楼主分享，希望大家都能无私分享

作者: べ_宠_ｕ⒈生。 时间: 2014-7-19 20:43

来荷塘月色论坛，学到了很多！

作者: lv007lv 时间: 2014-7-26 15:03
这个可以有的

作者: apple 时间: 2014-8-14 12:17
21111111111111

作者: 阿汤哥 时间: 2014-8-21 02:48
看看看看看看看看看看看看看看看看看看

作者: 荷塘月色amdin 时间: 2014-9-6 06:11
bucuo
我喜欢

作者: aijixian 时间: 2014-9-7 17:25
看下了代码没法复制的说

作者: seed555 时间: 2014-9-30 23:01
这个要学习

作者: 靜思 时间: 2014-10-5 13:04
这个好啊。我要了

作者: zeblee 时间: 2014-11-19 11:10
我擦擦，干货啊这是~~~

欢迎光临荷塘月色_淘宝抖音跨境电商卖家论坛社区 (https://htys123.com/)