<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="UTF-8">
|
<title>栏目详情</title>
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
<!--<link rel="stylesheet" type="text/css" href="../css/style.css"/>-->
|
</head>
|
<style>
|
h1,
|
h2,
|
h3,
|
h4,
|
h5,
|
h6,
|
strong{
|
font-weight: normal;
|
}
|
h1,
|
h2,
|
h3,
|
h4,
|
h5,
|
h6,
|
p,
|
ul,
|
ol{
|
margin: 0;
|
font-weight: normal;
|
}
|
ul,
|
ol{
|
list-style: none;
|
padding: 0;
|
}
|
a {
|
text-decoration: none;
|
color: #777777;
|
font-size: 12px;
|
}
|
a:focus{
|
background: transparent;
|
}
|
a:focus {
|
outline: none;
|
}
|
a:active{
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
}
|
body{
|
background: #EFEFEF;
|
font-family: "微软雅黑";
|
margin: 0;
|
}
|
|
.rich_media_title{
|
margin: 0px !important;
|
}
|
.titlePic{
|
width: 100%;
|
overflow: hidden;
|
margin:0px;
|
background: #fff;
|
}
|
.titlePic img{
|
width: 100%;
|
float: left;
|
}
|
.title{
|
background: white;
|
padding-top: 40px;
|
padding-bottom: 4px;
|
}
|
.line {
|
border-top: 1px solid #EFEFEF;
|
height: 1px;
|
position: relative;
|
}
|
.line h5 {
|
background: white;
|
display: inline-block;
|
width: 160px;
|
text-align: center;
|
font-size: 15px;
|
color: #888;
|
position: absolute;
|
top: 50%;
|
left: 50%;
|
margin-left: -80px;
|
margin-top: -11px;
|
}
|
/*分享图标*/
|
|
.cont-icon {
|
overflow: hidden;
|
box-sizing: border-box;
|
padding: 5px;
|
padding-top: 4px;
|
}
|
|
.cont-icon li {
|
width: 20%;
|
/*border: 1px solid forestgreen;*/
|
padding: 5px;
|
float: left;
|
box-sizing: border-box;
|
}
|
|
.cont-icon li a {
|
display: inline-block;
|
width: 100%;
|
height: 100%;
|
border-radius: 50%;
|
}
|
|
.cont-icon li:first-of-type a {
|
background: url(../img/wx.png) no-repeat bottom;
|
background-size: 70% 70%;
|
}
|
|
.cont-icon li:nth-of-type(2) a {
|
background: url(../img/qqq.png) no-repeat bottom;
|
background-size: 70% 70%;
|
}
|
|
.cont-icon li:nth-of-type(3) a {
|
background: url(../img/pyq.png) no-repeat bottom;
|
background-size: 70% 70%;
|
}
|
|
.cont-icon li:nth-of-type(4) a {
|
background: url(../img/kj.png) no-repeat bottom;
|
background-size: 70% 70%;
|
}
|
|
.cont-icon li:nth-of-type(5) a {
|
background: url(../img/wb.png) no-repeat bottom;
|
background-size: 70% 70%;
|
}
|
/*商品详情*/
|
.goods{
|
background: white;
|
margin-top: 10px;
|
}
|
.goods h5{
|
line-height: 40px;
|
font-size: 15px;
|
color: #333;
|
text-align: center;
|
}
|
.goods ul{
|
display: flex;
|
flex-wrap: wrap;
|
box-sizing: border-box;
|
border-top:1px solid #EFEFEF;
|
}
|
.goods li{
|
width: 50%;
|
box-sizing: border-box;
|
padding: 5px;
|
border-bottom: 1px solid #EFEFEF;
|
}
|
.goods li a{
|
display: inline-block;
|
padding: 5px;
|
width: 100%;
|
color: #333;
|
font-size: 14px;
|
box-sizing: border-box;
|
}
|
.goods li:nth-of-type(odd){
|
border-right:1px solid #EFEFEF;
|
}
|
.goods li img{
|
width: 100%;
|
border-radius: 10px;
|
}
|
|
.goods li p:first-of-type{
|
line-height: 26px;
|
overflow: hidden;
|
font-size: 14px;
|
text-overflow: ellipsis;
|
display: -webkit-box;
|
-webkit-line-clamp: 2;
|
-webkit-box-orient: vertical;
|
}
|
.icon{
|
display: inline-block;
|
background: #FF3083;
|
text-align: center;
|
padding: 0 6px;
|
font-size: 12px;
|
border-radius: 4px;
|
color: #fff;
|
line-height: 20px;
|
margin-right: 14px;
|
}
|
.icon.tb{
|
background: #FF4400;
|
}
|
|
.icon.tm{
|
background: #FF3083;
|
}
|
|
.goods li p:nth-of-type(2){
|
padding: 6px 0;
|
padding-bottom: 0;
|
font-size: 18px;
|
color: #FF3044;
|
font-weight: bold;
|
}
|
.goods li p:nth-of-type(2) span{
|
font-size: 14px;
|
font-weight: normal;
|
}
|
.goods li p:nth-of-type(3){
|
font-size: 12px;
|
color: #FF3044;
|
line-height: 26px;
|
overflow: hidden;
|
}
|
.goods li p:nth-of-type(3) span:first-of-type{
|
color: #999;
|
/*margin-right: 12px;*/
|
text-decoration: line-through;
|
float: left;
|
|
}
|
.goods li p:nth-of-type(3) span:last-of-type{
|
float: right;
|
}
|
.goods li p:last-of-type{
|
padding-top: 6px;
|
overflow: hidden;
|
font-size: 12px;
|
}
|
.fl{
|
float: left;
|
color: #888;
|
font-size: 13px;
|
}
|
.fr{
|
display: inline-block;
|
float: right;
|
background: #F8B551;
|
color: #fff;
|
border-radius: 4px;
|
padding: 1px 4px 2px 4px;
|
}
|
.zdy{
|
background-color: white;
|
}
|
.zdy img{
|
max-width: 88%;
|
height:auto;
|
margin: auto;
|
}
|
</style>
|
<body>
|
<div id="test"></div>
|
<div class="page">
|
<div class="titlePic">
|
<img src="../img/dufa.jpg"/>
|
</div>
|
<div class="zdy">
|
|
</div>
|
<div class="title" style="display: none;">
|
<div class="line">
|
<h5>分享给朋友</h5>
|
</div>
|
<ul class="cont-icon">
|
<li>
|
<a href="#"></a>
|
</li>
|
<li>
|
<a href="#"></a>
|
</li>
|
<li>
|
<a href="#"></a>
|
</li>
|
<li>
|
<a href="#"></a>
|
</li>
|
<li>
|
<a href="#"></a>
|
</li>
|
</ul>
|
</div>
|
<div class="goods">
|
<h5>编辑推荐</h5>
|
<ul class="content">
|
</ul>
|
</div>
|
</div>
|
<div class="muban muban1" style="display: none;">
|
<li>
|
<a href="javascript:;">
|
<img class="min-pic"/>
|
<p class="gtitle"><span class="icon tb">淘宝</span></p>
|
<p class="qprice"><span>券后价￥</span></p>
|
<p class="zprice"><span>￥99</span><span></span></p>
|
<p class="yx">
|
<span class="fl"></span>
|
<span class="fr">优惠券</span>
|
</p>
|
</a>
|
</li>
|
</div>
|
<div class="muban muban2" style="display: none;">
|
<li>
|
<a href="javascript:;">
|
<img class="min-pic" src="http://img.alicdn.com/bao/uploaded/i4/37834516/TB2WAsilHFlpuFjy0FgXXbRBVXa_!!37834516.jpg"/>
|
<p class="gtitle"><span class="icon tb">淘宝</span></p>
|
<p class="qprice"><span>￥</span></p>
|
<p class="zprice"></p>
|
<p class="yx">
|
<span class="fl">月销1019</span>
|
</p>
|
</a>
|
</li>
|
</div>
|
</body>
|
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
|
<script type="text/javascript" src="../js/base64.js"></script>
|
<script type="text/javascript" src="//g.alicdn.com/mtb/lib-applink/0.3.4/??callApp.js,linksdk.js"></script>
|
<script type="text/javascript">
|
var falg = false;
|
$(function(){
|
|
var agent = navigator.userAgent;
|
// $("#test").text(agent);
|
var index1 = agent.indexOf("QQ");
|
var index2 = agent.indexOf("Windows");
|
var index3 = agent.indexOf("360");
|
var index4 = agent.indexOf("UCBrowser");
|
var index5 = agent.indexOf("MicroMessenger");
|
var index6 = agent.indexOf("Weibo");
|
var index7 = agent.indexOf("Firefox");
|
|
if(index1 >= 0 || index2 >= 0 || index3 >= 0 || index4 >= 0 || index5 >= 0 || index6 >= 0 || index7 >= 0){
|
falg=true;
|
$.getScript("../js/tbsdk.js");
|
}
|
|
|
var id = getArgsFromHref(location.href,"id");
|
|
$.post("../getRecommendSectionDetail",{"id":id},function(data){
|
if(data.code==0){
|
setData(data.data);
|
}
|
},'json');
|
|
$.post("../getRecommendSectionGoodsList",{"id":id},function(data){
|
if(data.code==0){
|
setGoodsData(data.data);
|
}
|
},'json');
|
|
});
|
|
function setGoodsData(data){
|
var goodsList = data.goodsList;
|
var goodsHtml1 = $(".muban1").html();
|
var goodsHtml2 = $(".muban2").html();
|
var base64 = new Base64();
|
for (var ii=0;ii<goodsList.length;ii++) {
|
var tb = goodsList[ii];
|
var auctionId= tb.auctionId;
|
var pictUrl = tb.pictUrl;
|
var url = tb.auctionUrl;
|
var title= tb.title;
|
var shopType = tb.shopType;
|
var xl = tb.biz30day;
|
var entitle=base64.encode(title);
|
if(tb.showType==3 || tb.showType==1){
|
$(".content").append(goodsHtml1);
|
var $curli = $(".content li:last-child");
|
var quanPrice = tb.quanPrice;
|
$curli.find("a").attr("href","yestv://getgoodsdetail#"+auctionId+"#"+url+"#"+entitle);
|
$curli.find("img").attr("src",pictUrl);
|
|
if(shopType==2){
|
$curli.find(".icon").removeClass("tb");
|
$curli.find(".icon").addClass("tm");
|
$curli.find(".icon").text("天猫");
|
}
|
$curli.find(".gtitle span").after(title);
|
$curli.find(".qprice span").after(quanPrice);
|
$curli.find(".zprice span").text("￥"+tb.zkPrice);
|
//$curli.find(".zprice span:last-of-type").text("返利红包：￥"+tb.taoBaoHongBaoInfo.hongbao);
|
$curli.find(".zprice span:last-of-type").text("");
|
if(xl >= 10000){
|
xl = (xl/10000).toFixed(2)+"万";
|
}
|
$curli.find(".yx .fl").text("月销"+xl);
|
}else{
|
$(".content").append(goodsHtml2);
|
var $curli = $(".content li:last-child");
|
$curli.find("a").attr("href","yestv://getgoodsdetail#"+auctionId+"#"+url+"#"+entitle);
|
$curli.find("img").attr("src",pictUrl);
|
if(shopType==2){
|
$curli.find(".icon").removeClass("tb");
|
$curli.find(".icon").addClass("tm");
|
$curli.find(".icon").text("天猫");
|
}
|
$curli.find(".gtitle span").after(title);
|
$curli.find(".qprice span").after(tb.zkPrice);
|
//$curli.find(".zprice").text("返利红包：￥"+tb.taoBaoHongBaoInfo.hongbao);
|
$curli.find(".zprice").text("");
|
if(xl >= 10000){
|
xl = (xl/10000).toFixed(2)+"万";
|
}
|
$curli.find(".yx .fl").text("月销"+xl);
|
}
|
if(falg){
|
$(".content a").eq(ii).bind("click",function(){
|
window.BC_SDK.goTaoke({
|
tkUrl : url,
|
params : {
|
pid: "mm_106929643_20324269_73400452", // 淘客必填
|
}
|
});
|
return false;
|
});
|
}
|
|
$('.cont-icon li a').height($('.cont-icon li a').width());
|
}
|
}
|
|
function setData(data){
|
var picUrl = data.picUrl;
|
var html = data.html;
|
// $(".titlePic").attr("href",picUrl);
|
$(".titlePic img").attr("src",picUrl);
|
$(".zdy").append(html);
|
}
|
|
|
function getArgsFromHref(sHref, sArgName) {
|
var args = sHref.split("?");
|
var retval = "";
|
|
if(args[0] == sHref) /*参数为空*/ {
|
return retval; /*无需做任何处理*/
|
}
|
var str = args[1];
|
args = str.split("&");
|
for(var i = 0; i < args.length; i++) {
|
str = args[i];
|
var arg = str.split("=");
|
if(arg.length <= 1) continue;
|
if(arg[0] == sArgName) retval = arg[1];
|
}
|
return retval;
|
}
|
</script>
|
</html>
|
