淘宝美工论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 1889|回复: 8
收起左侧

誓言大神的收藏店铺后领取优惠券,发个1920宽文字版的

[复制链接]
  • TA的每日心情

    2016-11-20 16:01
  • 签到天数: 99 天

    连续签到: 1 天

    [LV.6]渐入佳境

    7

    主题

    222

    帖子

    2万

    积分

    中级会员

    阅读权限: 30

    Rank: 3Rank: 3

    积分
    24577

    最佳新人热心会员

    QQ
    发表于 2015-8-19 15:55:38 | 显示全部楼层 |阅读模式
    1. <div style="width:990px;height:120px;">
    2.   <div class="footer-more-trigger" style="width:960px;height:120px;padding:0px;border:0;left:50%;top:auto;">
    3.     <div class="footer-more-trigger" style="width:1920px;height:120px;padding:0px;border:0;left:-960px;top:-10px;z-index:2;background:#FE3232;">
    4.       <div class="J_TWidget" data-widget-type="Tabs" data-widget-config="{"activeTriggerCls":"hidden","effect":"fade","navCls":"shiyan-youhuiquan-nav","triggerType":"click","contentCls":"shiyan-youhuiquan-con","autoplay":false}">
    5.         <div style="margin-left:485px;position:relative;width:950px;height:120px;overflow:hidden;">
    6.           <div style="float:right;height:100px;width:710px;margin:10px 0 0 0;font-family:微软雅黑;">
    7.              <a style="float:left;width:168px;margin-right:10px;height:98px;border:1px solid #FFFB88;color:#FFF;text-decoration:none;display:block;" href="#" data-spm-anchor-id="0.0.0.0">
    8.             <div style="height:55px;">
    9.               <div style="float:left;margin-right:8px;width:65px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    10.                  10
    11.               </div>
    12.               <div style="margin:10px 0 0 10px;">
    13.                 <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    14.                    元优惠券
    15.                 </div>
    16.                 <div style="height:16px;font-size:14px;line-height:16px;">
    17.                    无门槛使用
    18.                 </div>
    19.               </div>
    20.             </div>
    21.             <div style="height:0;clear:both;">
    22.                
    23.             </div>
    24.             <div style="text-align:center;padding:0 30px;">
    25.               <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    26.                  点击领取
    27.               </div>
    28.             </div>
    29.              </a> <a style="float:left;width:168px;margin-right:10px;height:98px;border:1px solid #FFFB88;color:#FFF;text-decoration:none;display:block;" href="#" data-spm-anchor-id="0.0.0.0">
    30.             <div style="height:55px;">
    31.               <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    32.                  20
    33.               </div>
    34.               <div style="margin:10px 0 0 10px;">
    35.                 <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    36.                    元优惠券
    37.                 </div>
    38.                 <div style="height:16px;font-size:14px;line-height:16px;">
    39.                    满399元使用
    40.                 </div>
    41.               </div>
    42.             </div>
    43.             <div style="height:0;clear:both;">
    44.                
    45.             </div>
    46.             <div style="text-align:center;padding:0 30px;">
    47.               <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    48.                  点击领取
    49.               </div>
    50.             </div>
    51.              </a> <a style="float:left;width:168px;margin-right:10px;height:98px;border:1px solid #FFFB88;color:#FFF;text-decoration:none;display:block;" href="#" data-spm-anchor-id="0.0.0.0">
    52.             <div style="height:55px;">
    53.               <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    54.                  50
    55.               </div>
    56.               <div style="margin:10px 0 0 10px;">
    57.                 <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    58.                    元优惠券
    59.                 </div>
    60.                 <div style="height:16px;font-size:14px;line-height:16px;">
    61.                    满599元使用
    62.                 </div>
    63.               </div>
    64.             </div>
    65.             <div style="height:0;clear:both;">
    66.                
    67.             </div>
    68.             <div style="text-align:center;padding:0 30px;">
    69.               <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    70.                  点击领取
    71.               </div>
    72.             </div>
    73.              </a> <a style="float:left;width:168px;height:98px;border:1px solid #FFFB88;color:#FFF;text-decoration:none;display:block;" href="#" data-spm-anchor-id="0.0.0.0">
    74.             <div style="height:55px;">
    75.               <div style="float:left;margin-right:5px;width:76px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    76.                  100
    77.               </div>
    78.               <div style="margin:10px 0 0 10px;">
    79.                 <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    80.                    元优惠券
    81.                 </div>
    82.                 <div style="height:16px;font-size:14px;line-height:16px;">
    83.                    满899元使用
    84.                 </div>
    85.               </div>
    86.             </div>
    87.             <div style="height:0;clear:both;">
    88.                
    89.             </div>
    90.             <div style="text-align:center;padding:0 30px;">
    91.               <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    92.                  点击领取
    93.               </div>
    94.             </div>
    95.              </a>
    96.           </div>
    97.           <div style="width:200px;margin:10px 0 0 10px;text-align:center;color:#FFF;font-family:微软雅黑;">
    98.             <div style="font-size:20px;line-height:48px;font-weight:700;">
    99.                领取优惠券,再购物
    100.             </div>
    101.             <div style="font-size:16px;line-height:20px;">
    102.                右侧领取优惠券
    103.             </div>
    104.             <div style="font-size:12px;line-height:30px;">
    105.                优惠券使用时间:8月1日—8月31日
    106.             </div>
    107.           </div>
    108.         </div>
    109.         <div class="shiyan-youhuiquan-slide-con shiyan-youhuiquan-con footer-more-trigger" style="left:0px;top:0px;padding:0;border:none;height:0px;width:950px;">
    110.           <div class="con-item" style="display:block;opacity:1;z-index:9;">
    111.             <div style="width:950px;height:120px;opacity:0.8;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);">
    112.                
    113.             </div>
    114.           </div>
    115.           <div class="con-item" style="display:block;opacity:0;z-index:1;">
    116.             <div style="margin-left:485px;position:relative;width:950px;height:120px;overflow:hidden;">
    117.               <div style="float:right;height:100px;width:710px;margin:10px 0 0 0;font-family:微软雅黑;">
    118.                  <a href="#" target="_blank" class="footer-more" style="padding-top:0;display:block;border:1px solid #FFFB88;color:#FFF;text-decoration:none;float:left;margin-bottom:0;height:98px;width:168px;margin-right:10px;" data-spm-anchor-id="a1z10.1-c.w5003-11567672136.5" data-spm-wangpu-module-id="5003-11567672136"> <span class="footer-more-panel" style="right:0;bottom:0;border:0;padding:0;width:168px;height:98px;color:#FE3232;background:#FFFB88;">
    119.                 <div style="height:55px;">
    120.                   <div style="float:left;margin-right:8px;width:65px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    121.                      10
    122.                   </div>
    123.                   <div style="margin:10px 0 0 10px;">
    124.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    125.                        元优惠券
    126.                     </div>
    127.                     <div style="height:16px;font-size:14px;line-height:16px;">
    128.                        无门槛使用
    129.                     </div>
    130.                   </div>
    131.                 </div>
    132.                 <div style="height:0;clear:both;">
    133.                   
    134.                 </div>
    135.                 <div style="text-align:center;padding:0 30px;">
    136.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FE3232;color:#FFFB88;font-size:14px;line-height:16px;font-weight:700;">
    137.                      点击领取
    138.                   </div>
    139.                 </div>
    140.                  </span>
    141.                 <div style="height:55px;">
    142.                   <div style="float:left;margin-right:8px;width:65px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    143.                      10
    144.                   </div>
    145.                   <div style="margin:10px 0 0 10px;">
    146.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    147.                        元优惠券
    148.                     </div>
    149.                     <div style="height:16px;font-size:14px;line-height:16px;">
    150.                        无门槛使用
    151.                     </div>
    152.                   </div>
    153.                 </div>
    154.                 <div style="height:0;clear:both;">
    155.                   
    156.                 </div>
    157.                 <div style="text-align:center;padding:0 30px;">
    158.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    159.                      点击领取
    160.                   </div>
    161.                 </div>
    162.                  </a> <a href="#" target="_blank" class="footer-more" style="padding-top:0;display:block;border:1px solid #FFFB88;color:#FFF;text-decoration:none;float:left;margin-bottom:0;height:98px;width:168px;margin-right:10px;" data-spm-anchor-id="a1z10.1-c.w5003-11567672136.6" data-spm-wangpu-module-id="5003-11567672136"> <span class="footer-more-panel" style="right:0;bottom:0;border:0;padding:0;width:168px;height:98px;color:#FE3232;background:#FFFB88;">
    163.                 <div style="height:55px;">
    164.                   <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    165.                      20
    166.                   </div>
    167.                   <div style="margin:10px 0 0 10px;">
    168.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    169.                        元优惠券
    170.                     </div>
    171.                     <div style="height:16px;font-size:14px;line-height:16px;">
    172.                        满399元使用
    173.                     </div>
    174.                   </div>
    175.                 </div>
    176.                 <div style="height:0;clear:both;">
    177.                   
    178.                 </div>
    179.                 <div style="text-align:center;padding:0 30px;">
    180.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FE3232;color:#FFFB88;font-size:14px;line-height:16px;font-weight:700;">
    181.                      点击领取
    182.                   </div>
    183.                 </div>
    184.                  </span>
    185.                 <div style="height:55px;">
    186.                   <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    187.                      20
    188.                   </div>
    189.                   <div style="margin:10px 0 0 10px;">
    190.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    191.                        元优惠券
    192.                     </div>
    193.                     <div style="height:16px;font-size:14px;line-height:16px;">
    194.                        满399元使用
    195.                     </div>
    196.                   </div>
    197.                 </div>
    198.                 <div style="height:0;clear:both;">
    199.                   
    200.                 </div>
    201.                 <div style="text-align:center;padding:0 30px;">
    202.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    203.                      点击领取
    204.                   </div>
    205.                 </div>
    206.                  </a> <a href="#" target="_blank" class="footer-more" style="padding-top:0;display:block;border:1px solid #FFFB88;color:#FFF;text-decoration:none;float:left;margin-bottom:0;height:98px;width:168px;margin-right:10px;" data-spm-anchor-id="a1z10.1-c.w5003-11567672136.7" data-spm-wangpu-module-id="5003-11567672136"> <span class="footer-more-panel" style="right:0;bottom:0;border:0;padding:0;width:168px;height:98px;color:#FE3232;background:#FFFB88;">
    207.                 <div style="height:55px;">
    208.                   <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    209.                      50
    210.                   </div>
    211.                   <div style="margin:10px 0 0 10px;">
    212.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    213.                        元优惠券
    214.                     </div>
    215.                     <div style="height:16px;font-size:14px;line-height:16px;">
    216.                        满599元使用
    217.                     </div>
    218.                   </div>
    219.                 </div>
    220.                 <div style="height:0;clear:both;">
    221.                   
    222.                 </div>
    223.                 <div style="text-align:center;padding:0 30px;">
    224.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FE3232;color:#FFFB88;font-size:14px;line-height:16px;font-weight:700;">
    225.                      点击领取
    226.                   </div>
    227.                 </div>
    228.                  </span>
    229.                 <div style="height:55px;">
    230.                   <div style="float:left;margin-right:8px;width:70px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    231.                      50
    232.                   </div>
    233.                   <div style="margin:10px 0 0 10px;">
    234.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    235.                        元优惠券
    236.                     </div>
    237.                     <div style="height:16px;font-size:14px;line-height:16px;">
    238.                        满599元使用
    239.                     </div>
    240.                   </div>
    241.                 </div>
    242.                 <div style="height:0;clear:both;">
    243.                   
    244.                 </div>
    245.                 <div style="text-align:center;padding:0 30px;">
    246.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    247.                      点击领取
    248.                   </div>
    249.                 </div>
    250.                  </a> <a href="#" target="_blank" class="footer-more" style="padding-top:0;display:block;border:1px solid #FFFB88;color:#FFF;text-decoration:none;float:left;margin-bottom:0;height:98px;width:168px;margin-right:0;" data-spm-anchor-id="a1z10.1-c.w5003-11567672136.8" data-spm-wangpu-module-id="5003-11567672136"> <span class="footer-more-panel" style="right:0;bottom:0;border:0;padding:0;width:168px;height:98px;color:#FE3232;background:#FFFB88;">
    251.                 <div style="height:55px;">
    252.                   <div style="float:left;margin-right:5px;width:76px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    253.                      100
    254.                   </div>
    255.                   <div style="margin:10px 0 0 10px;">
    256.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    257.                        元优惠券
    258.                     </div>
    259.                     <div style="height:16px;font-size:14px;line-height:16px;">
    260.                        满899元使用
    261.                     </div>
    262.                   </div>
    263.                 </div>
    264.                 <div style="height:0;clear:both;">
    265.                   
    266.                 </div>
    267.                 <div style="text-align:center;padding:0 30px;">
    268.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FE3232;color:#FFFB88;font-size:14px;line-height:16px;font-weight:700;">
    269.                      点击领取
    270.                   </div>
    271.                 </div>
    272.                  </span>
    273.                 <div style="height:55px;">
    274.                   <div style="float:left;margin-right:5px;width:76px;height:55px;font-size:45px;line-height:50px;font-weight:700;font-family:impact;text-align:right;">
    275.                      100
    276.                   </div>
    277.                   <div style="margin:10px 0 0 10px;">
    278.                     <div style="height:28px;font-size:16px;line-height:34px;font-weight:700;">
    279.                        元优惠券
    280.                     </div>
    281.                     <div style="height:16px;font-size:14px;line-height:16px;">
    282.                        满899元使用
    283.                     </div>
    284.                   </div>
    285.                 </div>
    286.                 <div style="height:0;clear:both;">
    287.                   
    288.                 </div>
    289.                 <div style="text-align:center;padding:0 30px;">
    290.                   <div style="padding:1px;border:1px solid #FFFB88;background:#FFFB88;color:#FE3232;font-size:14px;line-height:16px;font-weight:700;">
    291.                      点击领取
    292.                   </div>
    293.                 </div>
    294.                  </a>
    295.               </div>
    296.               <div style="width:200px;margin:10px 0 0 10px;text-align:center;font-family:微软雅黑;color:#FFF;">
    297.                 <div style="font-size:20px;line-height:48px;font-weight:700;">
    298.                    领取优惠券,再购物
    299.                 </div>
    300.                 <div style="font-size:16px;line-height:20px;">
    301.                    右侧领取优惠券
    302.                 </div>
    303.                 <div style="font-size:12px;line-height:30px;">
    304.                    优惠券使用时间:8月1日—8月31日
    305.                 </div>
    306.               </div>
    307.             </div>
    308.           </div>
    309.         </div>
    310.         <div class="shiyan-youhuiquan-nav footer-more-trigger" style="left:0px;top:0px;z-index:11;padding:0;border:none;">
    311.           <div class="hidden" style="z-index:2;">
    312.             
    313.           </div>
    314.           <div style="width:1920px;height:120px;">
    315.              <a class="J_TokenSign" style="display:block;outline:none;text-decoration:none;width:1070px;height:110px;background:url(//gdp.alicdn.com/imgextra/i1/804325054/TB2RiGWdVXXXXbyXpXXXXXXXXXX_!!804325054.png) repeat;padding:10px 0 0 850px;" target="_blank" href="你的收藏店铺链接">
    316.             <div style="width:180px;height:80px;background:#FE3232;color:#FFF;text-align:center;font-family:微软雅黑;padding:10px 20px;">
    317.               <div style="font-size:24px;line-height:50px;font-weight:700;border-bottom:1px solid #FFF;">
    318.                  收藏本店
    319.               </div>
    320.               <div style="font-size:14px;line-height:30px;">
    321.                  然后获取优惠券
    322.               </div>
    323.             </div>
    324.              </a>
    325.           </div>
    326.         </div>
    327.       </div>
    328.     </div>
    329.   </div>
    330. </div>
    复制代码



    本来要写纯文字版本的,不过有半透明用了一张图片,以前写的  为了不同浏览器兼容半透明效果,  修改下图片   就能放自己店铺用,还算比较方便,就是代码长了点儿,抱歉

    评分

    参与人数 1美工币 +8 收起 理由
    风卷 + 8 乐于助人!

    查看全部评分

    淘宝代码问题直接加QQ:343063418
  • TA的每日心情

    2016-11-16 14:23
  • 签到天数: 438 天

    连续签到: 1 天

    [LV.9]已臻大成

    28

    主题

    2010

    帖子

    1万

    积分

    中级会员

    阅读权限: 30

    Rank: 3Rank: 3

    积分
    15421

    最佳新人热心会员活跃会员优秀版主

    发表于 2015-8-19 18:13:07 | 显示全部楼层
    你先告诉我,为什么这么长。你写这么长,万一发生感情怎么办

    《论坛帮助文档》有什么问题来这里看看吧,这里有你想知道的内容!


    淘宝美工论坛-汇聚淘宝美工高端人才,建设淘宝美工人才基地。请认准论坛唯一网址:www.taobaoux.com

  • TA的每日心情
    抱抱
    2016-1-16 16:07
  • 签到天数: 8 天

    连续签到: 1 天

    [LV.3]武林新秀

    1

    主题

    19

    帖子

    9792

    积分

    注册会员

    阅读权限: 20

    Rank: 2

    积分
    9792

    发表于 2015-9-5 11:41:18 | 显示全部楼层
    为什么天猫有偏移啊

    《论坛帮助文档》有什么问题来这里看看吧,这里有你想知道的内容!


    淘宝美工论坛-汇聚淘宝美工高端人才,建设淘宝美工人才基地。请认准论坛唯一网址:www.taobaoux.com

  • TA的每日心情

    2016-11-20 16:01
  • 签到天数: 99 天

    连续签到: 1 天

    [LV.6]渐入佳境

    7

    主题

    222

    帖子

    2万

    积分

    中级会员

    阅读权限: 30

    Rank: 3Rank: 3

    积分
    24577

    最佳新人热心会员

    QQ
     楼主| 发表于 2015-9-5 12:47:31 | 显示全部楼层
    把代码里所有“footer-more-trigger”改成“footer-more-trigger sn-simple-logo”
    淘宝代码问题直接加QQ:343063418
  • TA的每日心情
    不爽
    2015-11-19 04:50
  • 签到天数: 2 天

    连续签到: 1 天

    [LV.1]初学乍练

    0

    主题

    6

    帖子

    939

    积分

    新手上路

    阅读权限: 10

    Rank: 1

    积分
    939

    发表于 2015-9-16 00:23:55 | 显示全部楼层
    这效果做的还是很NICE的!

    《论坛帮助文档》有什么问题来这里看看吧,这里有你想知道的内容!


    淘宝美工论坛-汇聚淘宝美工高端人才,建设淘宝美工人才基地。请认准论坛唯一网址:www.taobaoux.com

  • TA的每日心情
    思考
    2015-12-28 08:12
  • 签到天数: 10 天

    连续签到: 1 天

    [LV.3]武林新秀

    0

    主题

    9

    帖子

    2480

    积分

    注册会员

    阅读权限: 20

    Rank: 2

    积分
    2480

    QQ
    发表于 2015-9-16 01:22:41 | 显示全部楼层
    收下看看

    《论坛帮助文档》有什么问题来这里看看吧,这里有你想知道的内容!


    淘宝美工论坛-汇聚淘宝美工高端人才,建设淘宝美工人才基地。请认准论坛唯一网址:www.taobaoux.com

  • TA的每日心情

    2016-11-20 16:01
  • 签到天数: 99 天

    连续签到: 1 天

    [LV.6]渐入佳境

    7

    主题

    222

    帖子

    2万

    积分

    中级会员

    阅读权限: 30

    Rank: 3Rank: 3

    积分
    24577

    最佳新人热心会员

    QQ
     楼主| 发表于 2015-9-16 08:55:08 | 显示全部楼层
    juzii 发表于 2015-9-16 00:23
    这效果做的还是很NICE的!

    放个店铺地址看看
    淘宝代码问题直接加QQ:343063418

    该用户从未签到

    0

    主题

    2

    帖子

    108

    积分

    新手上路

    阅读权限: 10

    Rank: 1

    积分
    108

    发表于 2015-10-26 16:59:39 | 显示全部楼层
    没看懂

    《论坛帮助文档》有什么问题来这里看看吧,这里有你想知道的内容!


    淘宝美工论坛-汇聚淘宝美工高端人才,建设淘宝美工人才基地。请认准论坛唯一网址:www.taobaoux.com

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    小黑屋|Archiver|手机版|粤公网安备44060502000322号|淘宝美工论坛 ( 桂ICP备12007265号-8 )  

    GMT+8, 2016-12-3 02:10 , Processed in 0.139487 second(s), 37 queries , Gzip On, Memcache On.

    Powered by Discuz! X3.2

    © 2001-2013 Comsenz Inc.

    快速回复 返回顶部 返回列表