Authored by happyhour7

Merge branch 'develop' into ww_develop

Conflicts:
	web/.sass-cache/bf6f5af5336c458f0990ca748a66f8b030cc4417/_1620_detail.scssc
	web/.sass-cache/bf6f5af5336c458f0990ca748a66f8b030cc4417/_768_detail.scssc
	web/.sass-cache/bf6f5af5336c458f0990ca748a66f8b030cc4417/_whatever_detail.scssc
	web/js/channel.js
	web/js/channel/detail.js
	web/js/channel/magazine.js
	web/js/plugin/comment.js
	web/package.json
	web/sass/scss/media/_1620_magazine.scss
	web/sass/scss/media/_768_about.scss
	web/sass/scss/media/_768_detail.scss
	web/sass/scss/media/_768_magazine.scss
	web/sass/scss/media/_whatever_magazine.scss
<<<<<<< HEAD
require('./channel/detail');
require('./channel/magazine')
=======
<<<<<<< HEAD
require('./channel/detail');
require('./channel/magazine')
=======
>>>>>>> develop
var $=require("jquery");
var tips=require("yoho-tips");
var box=require("yoho-box");
... ... @@ -91,4 +98,9 @@ dealItems();
$(".followus-button").trigger("click");
}
});
<<<<<<< HEAD
//===================================================================================================================
=======
//===================================================================================================================
>>>>>>> ww_develop
>>>>>>> develop
... ...
... ... @@ -7,8 +7,14 @@
var $ = require('jquery'),
share = require('../plugin/share'),
box = require('../plugin/box'),
<<<<<<< HEAD
imgZoom = require('../plugin/imgzoom'),
tools = require('yoho-tools');
=======
imgZoom = require('../plugin/imgZoom'),
tools = require('yoho-tools'),
mulLine = require('mlellipsis');
>>>>>>> develop
require('lazyload');
require('../plugin/slider');
... ... @@ -20,10 +26,48 @@ exports.init = function() {
detailTitle = $(".detail-title").find("h1"),
detailSubtitle = $(".detail-title").find("h2"),
ajaxParam,
<<<<<<< HEAD
cidNum;
//底部数据相关变量
=======
i,
data,
cidNum;
//底部数据相关变量
var adItem = '', //边栏广告
sideVideoTpl = '', //边栏视频模板
sideVideoData = '', //边栏视频数据
sideVideoHtml = '', //边栏视频渲染的html
sidePostTpl = '', //边栏relatedpost模板
sidePostData = '', //边栏relatedpost数据
sidePostHtml = ''; //边栏relatedpost渲染的html
//related-post截行相关变量
var relatedPost = '',
postList = '', //post列表
totalLineNum = '', //总行数
titleLineNum = '', //title行数
subTitleLineNum = ''; //subtitle行数
//滑出边栏小视频side-video播放区域暂停相关变量
var relatedPostsOffsetTop = '',
relatedPostsTop = '',
relatedPostsMarginLeft = '';
//页面滑动热播位置变化相关变量
var detailBodyOffsetTop = '',
relatedPostsOffsetHeightTop = '',
distance = '',
eleTop = '',
detailBodyHeight = '';
//初始化截行插件
mulLine.init();
>>>>>>> develop
//分享
share.init({
shareUrl: shareUrl,
... ... @@ -58,6 +102,7 @@ exports.init = function() {
//box.alert(tips.getTips("emailError"),5);
box.alert(22);
return;
<<<<<<< HEAD
}
window.open('/passport/subscribe/index?email=' + input.val());
});
... ... @@ -275,6 +320,269 @@ exports.init = function() {
});
=======
}
window.open('/passport/subscribe/index?email=' + input.val());
});
$(".focus-us .textbox input").keydown(function(event) {
if (event.keyCode === 13) {
$(this).next().trigger("click");
}
});
//图片轮播
if ($(".detail-slide-body").size() > 0) {
$(".detail-slide-ctrl-tabs").find("img.lazy").lazyload();
$(".detail-slide-body").imgZoom({
styleClass: 'detail-zoom'
});
$(".detail-slide-piclist").slider({
pageCtrl: $(".detail-slide-ctrl-tabs"),
pageCtrlAnimate: true
});
};
//调用评论插件
$(".stats-btn").on("click", ".comments", function() {
cidNum = $(".comments-box").attr("cid");
if ($(".comments-box").find(".comment-textarea").size() > 0) {
if ($(".comments-box").css("display") === "none") {
$(".comments-box").show();
} else {
$(".comments-box").hide();
}
} else {
$(".comments-box").comment({
cid: cidNum,
thirdLogin: true,
commentPageUrl: '/comment/default/list',
publishUrl: '/comment/default/publish',
deleteUrl: '/comment/default/delete'
});
}
});
//ajax参数
ajaxParam = {
id: $(".comments-box").attr("cid"),
type: $(".comments-box").attr("ctype"),
c: $(".comments-box").attr("cc"),
twoc: $(".comments-box").attr("ctwoc")
};
//右侧side的数据获取
$.ajax({
type: 'GET',
url: YohoConfig.mainUrl + '/channel/detail/getright', //?id=' + ajaxParam.id + '&type=' + ajaxParam.type + '&c=' + ajaxParam.c + '&twoc=' + ajaxParam.twoc,
success: function(response) {
data = response.data;
//广告
for (i = 0; i < data.banners.length; i++) {
adItem += '<a href="' + data.banners[i].link + '" target="_blank"><img src="' + data.banners[i].img + '" alt="" /></a>'
}
$(".detail-ad").html(adItem);
//没有广告去掉margin
if (data.banners.length == 0) {
$(".detail-side .app-download").css("margin", 0);
}
//视频
sideVideoTpl = $('#side-video-tpl').html();
sideVideoData = {
video: data.video
}
sideVideoHtml = mustache.render(sideVideoTpl, sideVideoData);
$('.detail-side').append($(sideVideoHtml));
if (navigator.userAgent.indexOf('iPad') !== -1) {
// 封面视频播放器替换为H5的VIDEO标签
if (!!$('.video-area').find('object').size()) {
$('.video-area').find('object').hide();
$('.side-video').find('video').show();
}
}
//边栏related-post
sidePostTpl = $('#side-related-posts').html();
sidePostData = {
relatedPost: {
postList: data.mosts
}
}
sidePostHtml = mustache.render(sidePostTpl, sidePostData);
$('.detail-side').append($(sidePostHtml));
//边栏related-post根据行数截取字符
relatedPost = relatedPost;
postList = relatedPost.find("li");
if (postList.length > 0) {
totalLineNum = 3;
postList.each(function(index, obj) {
titleLineNum = $(obj).find('h3').getTextLineNumber('title');
subTitleLineNum = $(obj).find('p').getTextLineNumber('subtitle');
if (titleLineNum > 2) {
$(obj).find('h3').mlellipsis(2);
titleLineNum = 2;
}
if (subTitleLineNum > totalLineNum - titleLineNum) {
$(obj).find('p').mlellipsis(totalLineNum - titleLineNum, 'detail');
}
});
}
//滑出小视频播放区域暂停小视频
$(window).resize(function() {
relatedPostsOffsetTop = relatedPost.offset().top - $('#minEnterprise').outerHeight();
relatedPostsTop = $('#minEnterprise').outerHeight();
relatedPostsMarginLeft = $('.detail-container').width() / 2 - relatedPost.outerWidth();
}).resize();
$(window).bind('scroll', function() {
function thisMovie(movieName) {
if (navigator.appName.indexOf('Microsoft') != -1) {
return window[movieName];
} else {
return document[movieName];
}
}
if ($('.side-video').size() > 0) {
if ($(window).scrollTop() >= $('.side-video').offset().top || $(window).scrollTop() < $('.side-video').offset().top - $(window).height()) {
try {
if (navigator.appName.indexOf('Microsoft') != -1) {
thisMovie('newestvideo').StopMovie();
} else if (navigator.userAgent.indexOf('iPad') !== -1) {
var videoId = document.getElementById('side-video-ipad');
videoId.pause();
} else {
$('.side-video').find('embed').get(0).StopMovie();
}
} catch (e) {}
}
}
if ($(window).scrollTop() >= relatedPostsOffsetTop && relatedPost.css('display') !== 'none') {
if (navigator.userAgent.indexOf('iPad') !== -1) return;
//right_tab_toped=true;
relatedPost.css({
'position': 'fixed',
'left': '50%',
'margin-left': relatedPostsMarginLeft,
'top': relatedPostsTop
});
//热播位置
detailBodyOffsetTop = $('.detail-body').offset().top;
detailBodyHeight = $('.detail-body').outerHeight();
relatedPostsOffsetHeightTop = relatedPost.offset().top + relatedPost.outerHeight();
distance = detailBodyHeight + detailBodyOffsetTop;
eleTop = distance - relatedPost.outerHeight();
if (relatedPostsOffsetHeightTop >= distance) {
relatedPost.css({
'position': 'absolute',
'top': eleTop - relatedPostsTop
});
}
if (relatedPost.offset().top - $(window).scrollTop() > relatedPostsTop) {
relatedPost.css({
'position': 'fixed',
'top': relatedPostsTop
});
}
} else if ($(window).scrollTop() < relatedPostsOffsetTop && relatedPost.css('display') !== 'none') {
//right_tab_toped=false;
relatedPost.removeAttr('style').show();
}
});
}
});
//底部数据的获取
$.ajax({
type: 'GET',
url: YohoConfig.mainUrl + '/channel/detail/getbottom', //?id=' + ajaxParam.id + '&type=' + ajaxParam.type + '&c=' + ajaxParam.c + '&twoc=' + ajaxParam.twoc,
success: function(response) {
data = response.data;
var relatedPost = data.related,
prevnext = data.prevnext,
attitude = data.attitude,
commentnum = data.commentnum;
//新品播报
var relatedPostItem = '';
for (var i = 0; i < relatedPost.length; i++) {
if (relatedPost[i].isVideo == true) {
relatedPostItem = '<li>' +
'<a href="' + relatedPost[i].link + '" target="_blank" onclick="relatedClickEvent();">' +
'<div class="pic"><img src="' + relatedPost[i].cover + '" alt="" /><span class="play-icon"></span></div>' +
'<div class="post-title"><h4>' + relatedPost[i].title + '</h4><p>' + relatedPost[i].subtitle + '</p></div>' +
'</a>' +
'</li>';
} else {
relatedPostItem = '<li>' +
'<a href="' + relatedPost[i].link + '" target="_blank">' +
'<div class="pic"><img src="' + relatedPost[i].cover + '" alt="" /></div>' +
'<div class="post-title"><h4>' + relatedPost[i].title + '</h4><p>' + relatedPost[i].subtitle + '</p></div>' +
'</a>' +
'</li>';
}
$(".postslist").append(relatedPostItem);
//新品播报根据行数截取字符
var citems = $(".related-posts li");
var totalLineNum = 3;
if (citems.length > 0) {
citems.each(function(index, obj) {
var self = $(obj);
var titleLineNum = self.find("h4").getTextLineNumber("title");
var subTitleLineNum = self.find("p").getTextLineNumber("subtitle");
if (titleLineNum > 2) {
self.find("h4").mlellipsis(2);
titleLineNum = 2;
}
if (subTitleLineNum > totalLineNum - titleLineNum) {
self.find("p").mlellipsis(totalLineNum - titleLineNum, "detail");
}
});
}
};
//上一篇下一篇
if (prevnext.prev.title) {
$(".news-next-prev .prev").show();
$(".news-next-prev .prev").find("a").attr("href", prevnext.prev.link).attr("title", prevnext.prev.title).attr("onclick", "prevOrNextClickEvent();");
}
if (prevnext.next.title) {
$(".news-next-prev .next").show();
$(".news-next-prev .next").find("a").attr("href", prevnext.next.link).attr("title", prevnext.next.title).attr("onclick", "prevOrNextClickEvent();");
}
//态度
if (attitude.userWow > 0) {
$(".stats-btn .wow").addClass("current");
};
if (attitude.userWtf > 0) {
$(".stats-btn .wtf").addClass("current");
};
if (attitude.userZzz > 0) {
$(".stats-btn .zzz").addClass("current");
};
setattitude(attitude.wowCount, attitude.zzzCount, attitude.wtfCount);
if (commentnum > 0) {
$(".comment-num").text(commentnum);
} else {
$(".comment-num").html('<img src="' + YohoConfig.resUrl + '/res/new/boys/images/mobile/comment-mobile.png">');
}
>>>>>>> develop
}
});
}
\ No newline at end of file
... ...
... ... @@ -9,8 +9,13 @@ var $ = require('jquery'),
swiper = require('yoho-idangerous.swiper');
require('lazyload');
<<<<<<< HEAD
require('../plugin/imgslider');
require('../plugin/imgzoom');
=======
require('../plugin/imgSlider');
require('../plugin/imgZoom');
>>>>>>> develop
exports.init = function() {
var shareUrl = $('.share').attr('data-link'),
... ...
... ... @@ -2,6 +2,7 @@
* 评论及登录插件
* author:liuyue
* date:2015-01-07
<<<<<<< HEAD
*/
var $ = require("jquery"),
validate = require("./validate"),
... ... @@ -9,10 +10,20 @@ var $ = require("jquery"),
tools = require("yoho-tools"),
tips = require("./tips");
mustache = require("mustache");
=======
*/
var $ = require("jquery"),
validate = require("./validate"),
box = require("./box"),
tools = require("yoho-tools"),
tips = require("./tips");
mustache = require("mustache");
>>>>>>> develop
require("./login");
(function(global, undefined) {
<<<<<<< HEAD
var Comment = function(element, options) {
this.options = options;
this.$element = $(element);
... ... @@ -126,13 +137,133 @@ require("./login");
} else if (moreString.length === 5) {
$(".view-more").find("span").text(moreFirstnum + 'w+');
}
=======
var Comment = function(element, options) {
this.options = options;
this.$element = $(element);
//this.$loginBox = $(this.options.loginbox).appendTo("body");
this.init();
};
Comment.DEFAULTS = {
cid: '',
commentPageUrl: '/writer/default/comment',
publishUrl: '/writer/default/publish',
deleteUrl: '/writer/default/delete',
commentNum: $(".comment-num"),
commentItemTpl: '<li class="clearfix">' +
'<div class="userimg">' +
'<img src="\{{userimg}}" alt="">' +
'<i class="\{{partnerType}}"></i>' +
'</div>' +
'<div class="userinfo">' +
'<h6>\{{username}}</h6> ' +
'<p class="comment-text">\{{content}}</p>' +
'\{{# isSelf}}' +
'<a class="delete-comment" href="javascript:;" pid="{{id}}"></a>' +
'\{{/ isSelf}} ' +
'</div>' +
'</li>',
thirdLogin: false,
isEdit: false,
isMobile: false,
login: ''
};
Comment.prototype = {
constructor: Comment,
init: function() {
// 组件的创建主函数。
this._creat();
},
// 主函数,主要是创建节点,绑定事件。
_creat: function() {
if ($(".comments-list").size() > 0 || $(".comment-textarea").size() > 0) return;
// 创建节点
this._creatCommentDom();
this._creatThirdLogin();
// 绑定事件
this._bindEvent();
},
_creatCommentDom: function() {
var that = this;
//var id = {id:this.options.cid};
$.ajax({
type: 'GET',
url: YohoConfig.mainUrl + this.options.commentPageUrl,
/*data: id,
dataType:'json',*/
success: function(response) {
var data = response.data, //返回数据的data
viewMoreNum = data.total - 5, //评论总数-5,除显示评论剩下的评论数量
moreString = viewMoreNum + '', //剩余评论数量转为字符串
moreFirstnum = moreString.slice(0, 1), //评论数量的首数字
commentTpl = $('#comment-tpl').html(), //引入评论html模板
commentPage, //分页数据
commentHtml, //用数据渲染后的html
commentData; //评论数据
if (data.length === 0) return;
commentData = {
comment: data.comment
};
//评论多于五条,渲染more节点
if (viewMoreNum > 0) {
commentData = {
comment: data.comment,
more: {
moreNum: viewMoreNum
}
}
}
//如果分页数据不为空和undefined,渲染分页
if ($.trim(data.page) !== '' || typeof(data.page) === 'undefined' || !!data.page) {
commentPage = data.page;
commentData = {
comment: data.comment,
more: {
moreNum: viewMoreNum
},
page: commentPage
}
}
commentHtml = mustache.render(commentTpl, commentData, {
html: commentPage
});
that.$element.prepend($(commentHtml));
//5条后的评论隐藏
that.$element.find("li").eq(4).nextAll().hide(); //5条后的评论隐藏
//评论总数上千显示k+,上万显示w+
if (moreString.length === 4) {
$(".view-more").find("span").text(moreFirstnum + 'k+');
} else if (moreString.length === 5) {
$(".view-more").find("span").text(moreFirstnum + 'w+');
}
>>>>>>> develop
}
});
},
});
},
<<<<<<< HEAD
//创建评论文本域
/*_creatTextareaDom:function(){
=======
//创建评论文本域
/*_creatTextareaDom:function(){
>>>>>>> develop
data = this.options.login;
var textarea = $('<div class="comment-textarea"><textarea placeholder="'+tips.getTips("textareaPlaceholder")+'" cid='+this.options.cid+'></textarea></div>'),
loginarea = $('<div class="login-status clearfix">\n\
... ... @@ -160,6 +291,7 @@ require("./login");
},*/
<<<<<<< HEAD
//创建第三方登录
_creatThirdLogin:function(){
var thirdLoginTpl = $("#third-login-tpl").html();
... ... @@ -182,11 +314,36 @@ require("./login");
//弹出登录框
/*$(this).login();
=======
//创建第三方登录
_creatThirdLogin: function() {
var thirdLoginTpl = $("#third-login-tpl").html();
if (this.options.thirdLogin === true) {
$(thirdLoginTpl).appendTo(this.$element);
//this.$element.html(thirdLoginTpl);
}
},
//事件绑定
_bindEvent: function() {
var that = this;
//查看更多评论
this.$element.on("click.comment", ".view-more", function() {
that.$element.find("li").show(); //显示第一页后五条
that.$element.find(".comment-pager-content").show(); //显示分页按钮
that.$element.find(".view-more").remove(); //移除view more
});
//弹出登录框
/*$(this).login();
>>>>>>> develop
this.$element.on("click.login",".publish-btn",function() {
if(that.options.isFeedback) return;
$(this).login("loginBoxAnimate");
});*/
<<<<<<< HEAD
//显示删除按钮
if (this.options.isMobile) {
this.$element.find(".delete-comment").show();
... ... @@ -205,6 +362,26 @@ require("./login");
nameInput = that.$element.find(".name-input"),
emailInput = that.$element.find(".email-input"),
comment = $textarea.val(),
=======
//显示删除按钮
if (this.options.isMobile) {
this.$element.find(".delete-comment").show();
} else {
this.$element.on("mouseenter", "li", function() {
$(this).find(".delete-comment").show();
}).on("mouseleave", "li", function() {
$(this).find(".delete-comment").hide();
});
}
//发表评论
this.$element.on("click.publish", ".publish-btn", function() {
var $textarea = that.$element.find("textarea"),
nameInput = that.$element.find(".name-input"),
emailInput = that.$element.find(".email-input"),
comment = $textarea.val(),
>>>>>>> develop
cid,
data,
commentsNum,
... ... @@ -216,7 +393,11 @@ require("./login");
if (!tools.IYOHO_isUserName(nameInput.val())) {
box.alert(tips.getTips("commentUncompleted"), 5, function() {
nameInput.focus();
<<<<<<< HEAD
});
=======
});
>>>>>>> develop
return false;
};
... ... @@ -224,7 +405,11 @@ require("./login");
if (emailInput.val() !== '' && !tools.IYOHO_isEmail(emailInput.val())) {
box.alert(tips.getTips("commentUncompleted"), 5, function() {
emailInput.focus();
<<<<<<< HEAD
});
=======
});
>>>>>>> develop
return false;
};
... ... @@ -232,6 +417,7 @@ require("./login");
if (typeof(comment) === 'undefined' || $.trim(comment) === '') {
box.alert(tips.getTips("commentUncompleted"), 5, function() {
$textarea.focus();
<<<<<<< HEAD
});
return false;
};
... ... @@ -400,20 +586,131 @@ require("./login");
data:'id='+id,
dataType:'json',
success:function(response)
=======
});
return false;
};
if (comment.length > 100) {
box.alert(tips.getTips("commentToMuch"), 5);
return false;
};
cid = that.$element.attr('cid');
if (!cid) {
return false;
};
data = {
id: cid,
comment: comment,
sync: '222',
title: '111'
};
$.ajax({
type: 'GET',
url: YohoConfig.mainUrl + that.options.publishUrl,
success: function(response) {
if (response.code === '800000') {
box.alert(tips.getTips("relogin"), 5);
that.$element.login("setLogout");
return false;
};
if (response.status && response.data) {
var $commentsList = $(".comments-list");
publishHtml = mustache.render(that.options.commentItemTpl, response.data);
if ($commentsList.find("li").size() === 0) {
$commentsList.html(publishHtml);
} else {
$commentsList.find("li").eq(0).before(publishHtml);
}
box.alert(tips.getTips("publishSuccess"), 5);
$(".comment-textarea textarea").val('');
commentsNum = 1;
if (!!parseInt(that.options.commentNum.eq(0).text())) {
commentsNum = parseInt(that.options.commentNum.eq(0).text()) + 1;
};
that.options.commentNum.text(commentsNum);
} else if (900000 === response.code) {
box.alert(tips.getTips("notSameContent"), 5);
} else {
box.alert(tips.getTips("systemBus"), 5);
}
publishHtml = mustache.render(that.options.commentItemTpl, response.data);
that.$element.find(".comments-list").prepend(publishHtml);
}
})
/*$.ajax({
type:'POST',
url:YohoConfig.mainUrl + that.options.publishUrl,
data: data,
dataType:'json',
success:function(response) {
if (response.code === '800000')
{
box.alert(tips.getTips("relogin"), 5);
that.$element.login("setLogout");
return false;
}
if (response.status && response.data) {
var $commentsList = $(".comments-list");
var commentItem = '<li class="clearfix">'+
'<div class="userimg">'+
'<img src="'+response.data.headpic+'" alt="">'+
'<i class="'+response.data.partnerType+'"></i>'+
'</div>'+
'<div class="userinfo">'+
'<h6>'+response.data.nick+'</h6>'+
'<p class="comment-text">'+response.data.content+'</p>'+
'<a class="delete-comment" href="javascript:;" pid="'+response.data.id+'"></a>'+
'</div>'+
'</li>';
if(that.options.isFeedback && $(".login-status .anonymous").css("display") != "none"){
commentItem = '<li class="clearfix">'+
'<div class="userimg">'+
'<img src="'+response.data.headpic+'" alt="">'+
'<i class="'+response.data.partnerType+'"></i>'+
'</div>'+
'<div class="userinfo">'+
'<h6>'+response.data.nick+'</h6>'+
'<p class="comment-text">'+response.data.content+'</p>'+
'</div>'+
'</li>';
}
if($commentsList .find("li").size()==0){
$commentsList .html(commentItem);
}else{
$commentsList .find("li").eq(0).before(commentItem);
}
if(that.options.isFeedback){
box.alert(tips.getTips("publishFeedback"), 5);
}else if(that.options.isEdit){
box.alert(tips.getTips("editPublishSuccess"), 5);
}else{
box.alert(tips.getTips("publishSuccess"), 5);
}
$(".comment-textarea textarea").val('');
var comments = 1;
if(!!parseInt(that.options.commentNum.eq(0).text())){
comments = parseInt(that.options.commentNum.eq(0).text())+1;
};
that.options.commentNum.text(comments);
}
else if(900000 == response.code){
box.alert(tips.getTips("notSameContent"), 5);
}
else
>>>>>>> develop
{
if (response.status)
{
_this.parents("li").remove();
var comments = parseInt($(".comment-num").eq(0).text())-1;
if(comments > 0){
that.options.commentNum.text(comments);
}else{
that.options.commentNum.html('<img src="'+YohoConfig.resUrl+'boysweb/assets/images/mobile/comment-mobile.png">');
$(".comment-num.zero").text(0);
$(".comment-num.edit-comment").text('留言');
}
}
box.alert(tips.getTips("systemBus"), 5);
}
<<<<<<< HEAD
});
});
});
... ... @@ -435,25 +732,109 @@ require("./login");
if(this.options.isFeedback) return;
$(".publish-btn").trigger("click.publish");
}
=======
}
}); */
});
>>>>>>> develop
};
//评论翻页
this.$element.on("click.commentPage", ".pager-item", function() {
var url = $(this).attr("href"),
pageHtml,
pageIcon,
commentListTop;
$.ajax({
type: 'GET',
url: url,
success: function(response) {
$(".comments-list").empty();
pageHtml = mustache.render(that.options.commentItemTpl, response.data.comment);
$(".comments-list").html(pageHtml);
function Plugin(option, _relatedTarget) {
return this.each(function() {
var $this = $(this);
var data = $this.data('yoho.Comment');
var options = $.extend({}, Comment.DEFAULTS, $this.data(), typeof option == 'object' && option);
// 如果没有初始化,则初始化该对象,并且把该对象绑定到此元素的yoho.PicSilder属性下。
if (!data) $this.data('yoho.Comment', (data = new Comment(this, options)));
pageIcon = $('<div class="channel-index-pager">' + response.data.page + '</div>');
$(".comment-pager-content").html(pageIcon);
commentListTop = $(".comments-list").offset().top - $("#minEnterprise").outerHeight();
$(window).scrollTop(commentListTop);
}
});
return false;
});
// 如果传递的options是一个字符串,则表示调用改对象的原型方法。
if (typeof option == 'string') data[option](_relatedTarget);
});
};
$.fn.comment = Plugin;
$.fn.comment.Constructor = Comment;
//删除评论
this.$element.on("click.deleteComment", ".delete-comment", function() {
var _this = $(this);
var id = _this.attr('pid');
var deleteTip = tips.getTips("deleteComment");
if (that.options.isFeedback) {
deleteTip = tips.getTips("deleteFeedback");
} else if (that.options.isEdit) {
deleteTip = tips.getTips("deleteEdit");
}
box.confirm(deleteTip, function() {
$.ajax({
type: 'POST',
url: YohoConfig.mainUrl + that.options.deleteUrl,
data: 'id=' + id,
dataType: 'json',
success: function(response) {
if (response.status) {
_this.parents("li").remove();
var comments = parseInt($(".comment-num").eq(0).text()) - 1;
if (comments > 0) {
that.options.commentNum.text(comments);
} else {
that.options.commentNum.html('<img src="' + YohoConfig.resUrl + 'boysweb/assets/images/mobile/comment-mobile.png">');
$(".comment-num.zero").text(0);
$(".comment-num.edit-comment").text('留言');
}
}
}
});
});
});
$(".third-login-box").on("click", "a", function() {
var _this = $(this);
if (!_this.attr('ref')) return;
window.open(_this.attr('ref'), "", "width=760,height=650,top=300,left=300");
return false;
})
$(".third-login-box").on("click", "a.yoho", function() {
$(this).login("loginBoxAnimate");
})
},
publishComment: function() {
var textareaVal = $(".comment-textarea").find("textarea").val();
if (!!!textareaVal || $.trim(textareaVal) === '') return;
if (this.options.isFeedback) return;
$(".publish-btn").trigger("click.publish");
}
};
function Plugin(option, _relatedTarget) {
return this.each(function() {
var $this = $(this);
var data = $this.data('yoho.Comment');
var options = $.extend({}, Comment.DEFAULTS, $this.data(), typeof option == 'object' && option);
// 如果没有初始化,则初始化该对象,并且把该对象绑定到此元素的yoho.PicSilder属性下。
if (!data) $this.data('yoho.Comment', (data = new Comment(this, options)));
// 如果传递的options是一个字符串,则表示调用改对象的原型方法。
if (typeof option == 'string') data[option](_relatedTarget);
});
};
$.fn.comment = Plugin;
$.fn.comment.Constructor = Comment;
})(this);
\ No newline at end of file
... ...
... ... @@ -6,6 +6,27 @@
window.tmp$ = null;
var $ = require('jquery');
window.tmp$ = $;
var Swiper = require("yoho.swiper");
require('./plugin/lazyloadImage');
$(".lazy").lazyload();
$.fn.top = function() {
if (arguments.length > 0) {
$(this).css("top", arguments[0]);
return $(this);
} else {
return parseFloat($(this).css("top").replace("px", ""));
}
};
$.fn.left = function() {
if (arguments.length > 0) {
$(this).css("left", arguments[0]);
return $(this);
} else {
return parseFloat($(this).css("left").replace("px", ""));
}
};
require("lazyload");
var Swiper = require("yoho-idangerous.swiper");
$(".lazy").lazyload();
... ... @@ -23,12 +44,12 @@ $.fn.id = function() {
//banner========================================================================================================
if ($(".swiper-container").find(".swiper-slide").length > 1) {
var mySwiper = new Swiper('.swiper-container', {
pagination : '.pagination-banner',
loop : true,
autoplay : 5000,
grabCursor : true,
paginationClickable : true,
autoStopPlay : false
pagination: '.pagination-banner',
loop: true,
autoplay: 5000,
grabCursor: true,
paginationClickable: true,
autoStopPlay: false
});
$('.arrow-left').on('click', function(e) {
e.preventDefault();
... ... @@ -78,11 +99,96 @@ $(".li-weixin").mouseover(function() {
$(".li-weixin").click(function() {
return false;
});
$(".content").click(function() {
$(".bitmap").hide();
$(".pop").hide();
});
//企业滚动效果======================================================================================================
var minMenuHasShow = false; //小导航是否显示
var isTop = true; //滚动条是否在顶部
$(window).scroll(function() {
var scrollTop = $(this).scrollTop();
if (scrollTop >= 177 && minMenuHasShow === false) {
$(".search-input-box").trigger("blur");
$("#maxEnterprise").css({
visibility: "hidden"
});
$("#minEnterprise").css({
"position": "fixed",
"margin-top": "0",
"padding-top": "10px",
"top": 0,
//left:"50%",
"z-index": 99999
}).show();
minMenuHasShow = true;
$(".search-input-box").hide();
$(".home-search-button").hide();
window.isSearching = false;
$(".search-text").width(73);
$(".search-text").find(".search-text-content").html("Search...");
$(".search-input-box").val("").hide().trigger("blur");
$(".search-area").find(".icons").show();
$(".home-search-button").hide();
window.isSearching = false;
} else if (scrollTop < 177 && minMenuHasShow === true) {
$(".search-input-box").trigger("blur");
$("#maxEnterprise").css({
visibility: "visible"
});
$("#minEnterprise").hide();
$(".search-input-box").hide();
$(".home-search-button").hide();
window.isSearching = false;
minMenuHasShow = false;
//搜索归位
$(".search-text").width(73);
$(".search-text").find(".search-text-content").html("Search...");
$(".search-input-box").val("").hide().trigger("blur");
$(".search-area").find(".icons").show();
$(".home-search-button").hide();
window.isSearching = false;
}
if (scrollTop > 0 && isTop === true) {
$(".return-to-top").stop().animate({
"filter": "alpha(opacity=70)",
"-moz-opacity": "0.7",
opacity: "0.7"
}, 200);
isTop = false;
} else if (scrollTop == 0) {
$(".return-to-top").stop().animate({
"filter": "alpha(opacity=0)",
"-moz-opacity": "0",
opacity: "0"
}, 200);
isTop = true;
}
$(".search-suggest").hide();
});
//===============================================================================================================
if (document.body.scrollTop > 0 && isTop === true) {
$(".return-to-top").animate({
"filter": "alpha(opacity=70)",
"-moz-opacity": "0.7",
opacity: "0.7"
}, 200);
isTop = false;
} else if (document.body.scrollTop == 0) {
$(".return-to-top").animate({
"filter": "alpha(opacity=0)",
"-moz-opacity": "0",
opacity: "0"
}, 200);
isTop = true;
}
//回到顶部按钮======================================================================================================
$(".return-to-top").click(function() {
$("html,body").animate({
... ... @@ -97,6 +203,24 @@ $(".return-to-top").click(function() {
});
//===============================================================================================================
//子菜单交互========================================================================================================
/*$.ajax({
url:"",
cache:false,
success:function(data){
var data=data.data;
}
});*/
function createSubMenu(info) {
var data = {};
data.menun = info.menu; //大菜单名字
data.submenu = info.submenu; //子菜单名字
}
//================================================================================================================
//子菜单交互========================================================================================================
function createSubMenu(info) {
var data = {};
... ... @@ -108,6 +232,7 @@ function createSubMenu(info) {
//================================================================================================================
//频道页、首页碎片交互=================================================================================================
//mulLine.init();
function dealItems() {
... ... @@ -116,11 +241,12 @@ function dealItems() {
return;
}
var totalLineNum = 7;
// 7 行
var maxTitleStrNum = 45;
// 15个字
var maxDetailStrNum = 66;
var maxDetailStrNum = 22;
// 22个字
if (document.body.clientWidth < 1190) {
... ... @@ -171,6 +297,24 @@ $(function() {
window.currentWidth = document.body.clientWidth;
//================================================================================================================
//=================================================================================================================
/*$(window).bind("resize",function(){
fillDetail();
});*/
//=================================================================================================================
var isIpad = getBrowType().bIsIpad;
$(function() {
dealItems();
});
window.currentWidth = document.body.clientWidth;
//================================================================================================================
//=================================================================================================================
/*$(window).bind("resize",function(){
fillDetail();
... ... @@ -188,6 +332,7 @@ if (isIpad === true) {
$(".search-text").show();
}
function getBrowType() {
var info = {};
var sUserAgent = navigator.userAgent.toLowerCase();
... ... @@ -222,6 +367,18 @@ if (!isIpad && $(".share").size() > 0) {
});
}
window.scrollWindow = function() {
if (document.body.clientWidth >= 1190) {
//document.body.scrollTop=850;
window.tmp$(window).scrollTop(850);
} else if (document.body.clientWidth < 1190 && document.body.clientWidth > 768) {
window.tmp$(window).scrollTop(700);
} else if (document.body.clientWidth <= 768) {
window.tmp$(window).scrollTop(600);
}
};
//搜索按钮===========================================================================
$(".search-input-box").keypress(function(event) {
var keyCode = event.keyCode;
... ...
... ... @@ -25,7 +25,12 @@
"yoho-tools": "~0.0.4",
"yoho-tips": "~0.0.1",
"jquery-ui": "~1.11.1",
"mustache": "2.0.0",
"yoho-idangerous.swiper": "0.0.2",
"jquery.autocomplete": "0.0.2",
"mlellipsis": "0.0.2",
"jquery.autocomplete": "~0.0.2"
},
"devDependencies": {
... ...
... ... @@ -329,7 +329,7 @@
height: 41px;
}
}
.postslist{
.related-posts .postslist{
margin: 14px 0 0 0;
width: 794px;
li{
... ... @@ -531,44 +531,45 @@
padding-bottom: 7px;
background: url("../assets/images/detail/side-line.png") no-repeat left bottom;
}
}
.side-postslist{
li{
margin: 18px 0 0 0;
.pic{
position: relative;
float: left;
width: 89px;
height: 59px;
img{
width: 100%;
height: 100%;
display: block;
}
.play-icon{
position: absolute;
width: 20px;
height: 19px;
background: url("../assets/images/detail/play-icon-s.png");
left: 50%;
top: 50%;
margin: -10px 0 0 -10px;
}
}
.post-title{
float: left;
width: 180px;
margin: 0 0 0 18px;
h4{
font-weight: bold;
font-size: 15px;
line-height: 16px;
.postslist{
li{
margin: 18px 0 0 0;
.pic{
position: relative;
float: left;
width: 89px;
height: 59px;
img{
width: 100%;
height: 100%;
display: block;
}
.play-icon{
position: absolute;
width: 20px;
height: 19px;
background: url("../assets/images/detail/play-icon-s.png");
left: 50%;
top: 50%;
margin: -10px 0 0 -10px;
}
}
p{
font-weight: bold;
color: #333;
line-height: 20px;
font-size: 15px;
.post-title{
float: left;
width: 180px;
margin: 0 0 0 18px;
h4{
font-weight: bold;
font-size: 15px;
line-height: 16px;
}
p{
font-weight: bold;
color: #333;
line-height: 20px;
font-size: 15px;
}
}
}
}
... ...
<<<<<<< HEAD
@media screen and (min-width:1190px){
.mags-container{
width: 1080px;
... ... @@ -217,4 +218,221 @@
}
}
=======
@media screen and (min-width: 1190px) {
.mags-container {
width: 1080px;
margin: 0 auto;
}
.newest-mags {
margin: 43px 0 0 0;
}
.mags-info {
width: 640px;
h2 {
margin: 26px 0 0 0;
height: 83px;
background-size: 36% 100%;
}
.mags-text {
margin: 38px auto 0;
width: 430px;
line-height: 24px;
font-size: 15px;
}
.date-price {
margin: 42px 0 0 0;
p {
font-size: 20px;
color: #333333;
text-align: center;
}
.price {
color: #666666;
font-size: 16px;
}
}
.mags-buy {
margin: 22px 0 0 0;
.buy-btn {
width: 160px;
height: 34px;
line-height: 34px;
font-size: 20px;
background: url("../assets/images/magazine/buy-btn.png") no-repeat center center;
}
}
}
.mags-slide {
width: 340px;
.slide-box {
height: 426px;
li {
width: 340px;
height: 426px;
}
}
.slide-ctrl {
margin: 20px 0 0 0;
li {
margin: 0 0 0 15px;
a {
display: block;
width: 12px;
height: 12px;
background: url("../assets/images/magazine/slide-ctrl.png");
}
}
li.on {
a {
background: url("../assets/images/magazine/slide-ctrl-current.png");
}
}
}
}
.column-slide {
margin: 50px 0 0 0;
.slide-box {
height: 361px;
width: 1080px;
.slide-piclist {
width: 1100px;
}
li {
width: 255px;
margin: 0 20px 0 0;
float: left;
img {
width: 100%;
height: 321px;
display: block;
}
span {
display: block;
margin: 18px 0 0 0;
line-height: 22px;
text-align: center;
font-size: 18px;
color: #000;
font-weight: bold;
}
}
}
}
.column-slide.magazine-list {
.slide-box {
width: 1100px;
li {
width: 275px;
a {
width: 255px;
}
}
}
}
.mags-column {
margin: 43px 0 0 0;
h2 {
line-height: 48px;
font-size: 28px;
text-align: center;
color: #000;
font-weight: bold;
}
.column-slide {
margin: 0 0 20px 0;
h4 {
line-height: 45px;
font-size: 20px;
font-weight: bold;
}
.slide-box {
margin: 5px 0 0 0;
height: 424px;
line-height: 424px;
.slide-piclist {
float: left;
width: 1096px;
height: 424px;
}
li {
margin: 0 17px 0 0;
width: 120px;
height: 212px;
.img-wrap {
width: 120px;
height: 180px;
}
img {
width: 120px;
height: 180px;
}
span {
margin: 0;
line-height: 32px;
font-size: 14px;
}
}
}
}
}
.column-slide.mags-app-download {
margin: 37px 0 0 0;
.slide-box {
height: auto;
li {
height: 172px;
img {
width: auto;
margin: 0 auto;
}
span {
margin: 0;
display: block;
font-weight: normal;
font-size: 18px;
line-height: 22px;
text-align: center;
}
h6 {
margin: 15px 0 0 12px;
font-size: 25px;
}
p {
margin: 0 0 0 12px;
line-height: 20px;
color: #666666;
font-size: 18px;
}
strong {
display: block;
margin: 22px 0 0 12px;
line-height: 18px;
font-size: 16px;
color: #000;
}
}
li.column-slide02 {
img {
margin: 11px 0 0 88px;
width: 170px;
height: 130px;
}
}
}
}
.column-slide.rule {
margin: 40px 0 0 0;
h2 {
line-height: 48px;
font-size: 28px;
font-weight: bold;
text-align: center;
}
.slide-box {
margin: 15px 0 0 0;
height: 381px;
}
}
>>>>>>> develop
}
\ No newline at end of file
... ...
@media screen and (max-width:768px){
.about-container{
width: 668px;
margin: 20px auto 0;
@media screen and (max-width: 768px) {
.about-container {
width: 668px;
margin: 20px auto 0;
}
.about-nav {
margin: 0 0 0 40px;
li {
line-height: 22px;
font-size: 14px;
margin-bottom: 15px;
}
}
.about-body {
margin: 0 0 0 200px;
max-width: 370px;
h2 {
line-height: 22px;
font-size: 14px;
}
p {
line-height: 18px;
font-size: 12px;
}
.about-section {
margin: 15px 0 0 0;
}
.about-section.contact-us {
img {
margin: 8px 0 0 -5px;
display: block;
width: 95px;
height: 95px;
}
}
}
.about-us-qr {
width: 230px;
margin: 34px 0 0 3px;
.product {
margin-bottom: 30px;
background-image: url("../assets/images/about/line.png");
background-repeat: no-repeat;
background-position: top center;
background-size: 2% 76%;
}
.product-wrap {
float: left;
img {
display: block;
width: 87px;
height: 87px;
}
img.qr-img {
width: 91px;
height: 91px;
}
span {
display: block;
text-align: center;
line-height: 30px;
font-size: 12px;
}
em {
font-size: 12px;
}
}
.product-wrap.product-wrap-right {
float: right;
}
}
.links-list {
margin: 10px 0 0 0;
width: 414px;
li {
float: left;
line-height: 34px;
width: 110px;
margin: 0 28px 0 0;
a {
font-size: 12px;
color: #333333;
}
}
}
.feedback .comment-textarea {
width: 370px;
textarea {
width: 354px;
}
.login-status {
width: 100%;
}
}
}
<<<<<<< HEAD
.about-nav{
margin: 0 0 0 40px;
... ... @@ -96,4 +186,6 @@
width: 100%;
}
}
}
\ No newline at end of file
}
=======
>>>>>>> develop
... ...
<<<<<<< HEAD
@media screen and (max-width:768px){
.detail-container{
... ... @@ -718,4 +719,713 @@
}
}
}
=======
@media screen and (max-width: 768px) {
.detail-container {
width: 668px;
margin: 14px auto 0;
}
/*detail标题*/
.detail-title {
width: 100%;
margin: 0 0 8px 0;
h1 {
line-height: 20px;
font-size: 14px;
font-weight: bold;
}
h2 {
line-height: 20px;
font-size: 14px;
font-weight: bold;
}
.detail-category {
font-size: 12px;
color: #666666;
line-height: 30px;
a {
color: #666666;
}
}
}
/*detail主体*/
.detail-body {
float: left;
width: 460px;
object {
width: 460px;
height: 259px;
}
embed {
width: 460px;
height: 259px;
}
video {
width: 460px;
height: 259px;
}
}
.video-wrap.current {
width: 182px;
object {
width: 182px;
height: 103px;
}
embed {
width: 182px;
height: 103px;
}
video {
width: 182px;
height: 103px;
}
}
/*slide图片*/
.detail-slide-body {
width: 100%;
height: 266px;
overflow: hidden;
}
.detail-slide-piclist {
li {
float: left;
width: 460px;
height: 266px;
line-height: 266px;
}
}
.detail-slide-ctrl {
padding: 15px 0 0 0;
width: 100%;
height: 44px;
position: relative;
.detail-slide-ctrl-prev, .detail-slide-ctrl-next {
position: relative;
margin: -44px 0 0 0;
width: 20px;
height: 44px;
line-height: 44px;
background-size: 50% 50%;
}
.detail-slide-ctrl-prev {
margin-right: -20px;
}
.detail-slide-ctrl-next {
margin-left: -20px;
}
}
.detail-slide-ctrl-tabs {
li {
position: relative;
float: left;
margin: 0 0 0 4px;
img {
display: block;
width: 77px;
height: 44px;
}
}
li:first-child {
margin: 0;
}
li.current {
.border {
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
border: 1px solid #000;
}
.arrow {
position: absolute;
width: 11px;
height: 6px;
top: -5px;
left: 50%;
margin: 0 0 0 -5px;
background-image: url("../assets/images/detail/slide-arrow.png");
background-size: 100% 100%;
}
}
}
/*资讯主体*/
.text-body {
line-height: 20px;
p {
margin: 16px 0;
line-height: 20px;
font-size: 12px;
}
}
/*标签*/
.tag-box {
margin: 26px 0 0 0;
padding: 0 0 11px 0;
background-size: 100%;
.taglist {
padding: 0 0 0 18px;
background: url("../assets/images/detail/tag-icon.png") no-repeat 1px 6px;
}
li {
float: left;
line-height: 24px;
height: 24px;
a {
padding: 0 10px 0 10px;
font-size: 14px;
color: #1c1c1b;
font-weight: bold;
}
}
li:last-child {
background: none;
}
li.last-child {
background: none;
}
}
/*统计栏*/
.stats-btn {
margin: 16px 0 0 0;
.statslist {
float: right;
}
li {
float: left;
width: 52px;
img {
display: block;
margin: 1px 0 0 1px;
}
strong {
float: left;
width: 20px;
height: 20px;
img {
display: block;
width: 18px;
height: 18px;
}
}
span {
float: left;
margin: -6px 0 0 -2px;
font-size: 10px;
color: #000;
}
}
li.comments {
margin: 0;
padding: 0;
border-left: 1px solid #000;
img, span {
float: right;
}
span {
margin: 10px 0 0 0;
img {
width: 17px;
height: 8px;
}
line-height:8px;
}
img {
width: 18px;
height: 17px;
}
}
li.current {
strong {
background-image: url("../assets/images/detail/stats-cur-bg.png");
background-size: 100% 100%;
}
}
}
/*评论*/
.comments-box {
margin: 5px 0 0 0;
}
.comments-list {
li {
padding: 6px 0 10 0;
border-bottom: 1px solid #dbdbdb;
position: relative;
.userimg {
float: left;
margin: 5px 0 0 3px;
width: 28px;
height: 28px;
img {
width: 100%;
height: 100%;
}
i {
width: 11px;
height: 11px;
left: 20px;
bottom: 4px;
background-size: 100% 100%;
}
}
.userinfo {
float: left;
margin: 0 0 0 10px;
h6 {
line-height: 20px;
font-size: 13px;
font-weight: bold;
}
p {
margin: 2px 0 0 0;
line-height: 16px;
font-size: 12px;
}
}
}
}
.view-more {
margin: 18px 0 23px 0;
font-weight: bold;
text-align: center;
font-size: 14px;
line-height: 16px;
a {
color: #000;
}
}
.comment-textarea {
.anonymous-info {
margin-bottom: 6px;
input {
padding: 0 6px;
width: 217px;
height: 23px;
line-height: 23px;
&:first-child {
width: 216px;
}
}
}
textarea {
width: 447px;
height: 35px;
border: 1px solid #000;
resize: none;
margin: 0;
padding: 6px;
}
.login-status {
width: 455px;
height: 24px;
padding: 2px;
border: 1px solid #000;
border-top: none;
.userimg {
float: left;
margin: 3px 0 0 10px;
width: 20px;
height: 20px;
i {
width: 7px;
height: 7px;
left: 15px;
background-size: 100% 100%;
}
}
.userinfo {
margin: 0 0 0 18px;
font-size: 12px;
line-height: 24px;
}
.anonymous {
line-height: 20px;
}
.publish {
margin: 0px 16px 0 0;
.publish-btn {
width: 55px;
height: 22px;
line-height: 22px;
background-image: url("../assets/images/detail/publish-btn.png");
background-size: 100% 100%;
font-size: 12px;
}
}
}
}
/*上一篇下一篇*/
.news-next-prev {
margin: 30px 0 0 0;
height: 16px;
.prev {
float: left;
a {
margin: 0 0 0 12px;
padding: 0 0 0 22px;
background: url("../assets/images/detail/prev-arrow-1024.png") no-repeat left center;
}
}
.next {
float: right;
a {
margin: 0 12px 0 0;
padding: 0 22px 0 0;
background: url("../assets/images/detail/next-arrow-1024.png") no-repeat right center;
}
}
a {
display: block;
line-height: 16px;
font-size: 14px;
color: #999999;
}
}
/*related posts*/
.related-posts {
margin: 25px 0 0 0;
h2 {
padding: 0 0 6px 0;
line-height: 22px;
font-size: 14px;
color: #000;
font-weight: bold;
background-image: url("../assets/images/detail/detail-line-1024.png");
background-repeat: no-repeat;
background-position: center bottom;
background-size: 100%;
}
.load-more {
width: 119px;
height: 25px;
}
}
.related-posts .postslist {
margin: 14px 0 0 0;
width: 488px;
li {
float: left;
margin: 0 32px 0 0;
width: 212px;
height: 198px;
.pic {
position: relative;
img {
display: block;
width: 100%;
height: 135px;
}
.play-icon {
position: absolute;
width: 47px;
height: 43px;
background: url("../assets/images/detail/play-icon-1024.png");
background-size: 100% 100%;
left: 50%;
top: 50%;
margin: -22px 0 0 -23px;
}
.arrow-bottom {
border-width: 28px;
border-right-width: 0;
}
}
h4 {
margin: 6px 0 0 0;
font-size: 12px;
color: #000;
line-height: 14px;
font-weight: bold;
}
p {
font-weight: bold;
margin: 5px 0 0 0;
line-height: 14px;
font-size: 12px;
color: #333;
}
}
}
/*分享*/
.share {
top: 256px;
left: 50%;
margin-left: -370px;
h4 {
line-height: 23px;
font-size: 13px;
color: #000;
margin-bottom: 4px;
}
li {
width: 30px;
height: 30px;
margin-bottom: 10px;
img {
display: block;
width: 100%;
height: 100%;
}
}
}
/*detail侧边栏*/
.detail-side {
float: left;
margin: 0 0 0 26px;
width: 182px;
}
.detail-ad {
img {
display: block;
width: 100%;
}
}
.app-download {
margin: 17px 0 0 0;
padding: 6px 0 6px 6px;
width: 176px;
height: 62px;
background-size: 100% 100%;
.qr {
float: left;
width: 66px;
height: 62px;
img {
display: block;
width: 100%;
height: 100%;
}
}
.app-main {
float: left;
margin: 0 0 0 5px;
h6 {
margin: 0;
line-height: 20px;
font-size: 13px;
color: #000;
}
p {
width: 90px;
line-height: 12px;
font-size: 10px;
color: #989898;
}
.download-btn {
margin: 2px 0 0 0;
a {
float: left;
margin: 0 0 0 10px;
width: 33px;
height: 13px;
img {
display: block;
width: 100%;
height: 100%;
}
}
a:first-child {
width: 46px;
height: 13px;
margin: 0;
}
}
}
}
.focus-us {
margin: 19px 0 0 0;
padding: 12px 15px 17px;
width: 152px;
height: 66px;
background-size: 100% 100%;
h4 {
line-height: 20px;
font-size: 18px;
color: #000;
text-align: center;
}
.focuslist {
margin: 7px auto 0;
li {
float: left;
width: 15px;
height: 15px;
margin: 0 0px 0 16px;
img {
display: block;
height: 100%;
margin: 0 auto;
}
}
li.focus-wx {
position: relative;
.pop {
display: none;
z-index: 999;
position: absolute;
width: 85px;
height: 76px;
left: -34px;
top: 18px;
line-height: 76px;
vertical-align: middle;
background-size: 310%;
img {
display: inline;
vertical-align: middle;
width: 65px;
height: 65px;
margin: 7px 0 0 0;
}
}
}
li:first-child {
margin: 0 0 0 4px;
}
}
.textbox {
margin: 8px 0 0 0;
input {
float: left;
padding: 0 0 0 4px;
width: 108px;
height: 14px;
border: 1px solid #000;
outline: none;
font-size: 12px;
}
a {
float: left;
display: inline-block;
width: 38px;
height: 16px;
line-height: 16px;
background: #000;
color: #fff;
font-size: 12px;
text-align: center;
}
}
}
.side-map {
.map-section {
h2 {
font-size: 16px;
background-size: 100%;
}
h6 {
margin: 8px 0 0 6px;
font-size: 13px;
line-height: 16px;
color: #000;
}
p {
font-size: 12px;
}
}
}
.side-video {
margin: 17px 0 0 0;
.video-area {
object {
height: 98px;
embed {
height: 98px;
}
}
video {
height: 98px;
}
img {
width: 100%;
display: block;
}
}
h3 {
margin: 3px 0 0 0;
line-height: 18px;
font-size: 12px;
font-weight: bold;
color: #000;
}
p {
margin: 5px 0 0 0;
line-height: 14px;
font-size: 12px;
color: #000;
}
}
.side-related-posts {
margin: 24px 0 0 0;
h2 {
line-height: 21px;
font-size: 14px;
padding-bottom: 3px;
background-size: 100%;
}
.postslist {
li {
margin: 11px 0 0 0;
max-height: 37px;
overflow: hidden;
.pic {
width: 57px;
height: 38px;
.play-icon {
width: 17px;
height: 16px;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin: -8px 0 0 -9px;
}
}
.post-title {
float: left;
width: 115px;
margin: 0 0 0 10px;
h4 {
font-weight: bold;
font-size: 12px;
line-height: 16px;
}
p {
margin: 5px 0 0 0;
color: #333;
font-weight: bold;
line-height: 16px;
font-size: 12px;
}
}
}
}
}
.detail-zoom {
width: 500px;
margin-left: -250px;
text-align: center;
img {
max-width: 500px;
}
.guide-btn {
&.prev {
left: -70px;
}
&.next {
right: -70px;
}
}
}
>>>>>>> develop
}
... ...
<<<<<<< HEAD
@media screen and (max-width:768px){
.mags-container{
width: 668px;
... ... @@ -259,4 +260,257 @@
}
}
}
=======
@media screen and (max-width: 768px) {
.mags-container {
width: 668px;
margin: 0 auto;
}
.newest-mags {
margin: 25px 0 0 0;
}
.mags-info {
width: 395px;
h2 {
margin: 17px 0 0 0;
height: 51px;
background-size: 36% 100%;
}
.mags-text {
margin: 24px auto 0;
width: 258px;
line-height: 18px;
font-size: 12px;
}
.date-price {
margin: 20px 0 0 0;
p {
font-size: 14px;
}
.price {
font-size: 12px;
}
}
.mags-buy {
margin: 20px 0 0 0;
.buy-btn {
width: 99px;
height: 21px;
line-height: 21px;
font-size: 14px;
background-size: 100% 100%;
}
}
}
.mags-slide {
width: 210px;
.slide-box {
height: 264px;
li {
width: 210px;
height: 264px;
}
}
.slide-ctrl {
margin: 8px 0 0 0;
li {
margin: 0 0 0 9px;
a {
display: block;
width: 8px;
height: 8px;
background-size: 100% 100%;
}
}
li.on {
a {
background-size: 100% 100%;
}
}
}
}
.column-slide {
margin: 27px 0 0 0;
.slide-box {
height: 221px;
.slide-piclist {
width: 680px;
}
li {
width: 158px;
margin: 0 12px 0 0;
img {
width: 100%;
height: 198px;
display: block;
}
span {
margin: 7px 0 0 0;
line-height: 16px;
font-size: 12px;
}
}
}
.slide-ctrl {
a.slide-ctrl-prev {
left: -30px;
}
a.slide-ctrl-next {
right: -40px;
}
}
}
.column-slide.magazine-list {
.slide-box {
width: 680px;
li {
width: 170px;
a {
width: 158px;
}
}
}
}
.mags-column {
margin: 28px 0 0 0;
h2 {
line-height: 23px;
font-size: 20px;
}
.column-slide {
margin: 0 0 20px 0;
h4 {
line-height: 35px;
font-size: 14px;
}
.slide-box {
margin: 0px 0 0 0;
.slide-piclist {
width: 688px;
}
li {
margin: 0 22px 0 0;
width: 150px;
}
}
.slide-box {
margin: 0;
height: 268px;
.slide-piclist {
float: left;
width: 680px;
height: 268px;
}
li {
margin: 0 8px 0 0;
width: 76px;
height: 134px;
.img-wrap {
width: 76px;
height: 114px;
}
img {
width: 76px;
height: 114px;
}
span {
margin: 0;
line-height: 20px;
font-size: 12px;
}
}
}
.slide-ctrl {
a.slide-ctrl-prev {
left: -30px;
}
a.slide-ctrl-next {
right: -30px;
}
}
}
}
.column-slide.mags-app-download {
margin: 20px 0 0 0;
.slide-box {
height: auto;
li {
img {
width: auto;
margin: 0 auto;
}
span {
font-size: 12px;
line-height: 14px;
}
h6 {
margin: 8px 0 0 12px;
line-height: 20px;
font-size: 18px;
}
p {
margin: 0 0 0 12px;
line-height: 14px;
color: #666666;
font-size: 13px;
}
strong {
display: block;
margin: 12px 0 0 12px;
line-height: 18px;
font-size: 12px;
color: #000;
}
}
li.column-slide01 {
img {
width: 120px;
height: 110px;
}
}
li.column-slide02 {
img {
margin: 11px 0 0 38px;
width: 123px;
height: 94px;
}
}
li.column-slide03 {
img {
width: 94px;
height: 90px;
}
}
}
}
.column-slide.rule {
margin: 40px 0 0 0;
h2 {
line-height: 48px;
font-size: 28px;
font-weight: bold;
text-align: center;
}
.slide-box {
margin: 15px 0 0 0;
height: 237px;
}
}
.magazine-zoom {
width: 400px;
margin-left: -200px;
text-align: center;
img {
max-width: 400px;
}
.guide-btn {
&.prev {
left: -90px;
}
&.next {
right: -90px;
}
}
}
>>>>>>> develop
}
\ No newline at end of file
... ...
... ... @@ -4,7 +4,6 @@
}
/*detail标题*/
.detail-title{
width: 100%;
margin: 0 0 5px 0;
... ... @@ -29,10 +28,10 @@
text-decoration: underline;
}
}
}
}
/*detail主体*/
.detail-body{
.detail-body{
float: left;
width: 630px;
font-size:14px;
... ... @@ -609,7 +608,7 @@
background-size: 100% 100%;
}
}
.postslist{
.related-posts .postslist{
margin: 14px 0 0 0;
width: 672px;
li{
... ... @@ -866,7 +865,6 @@
}
}
.side-video{
display: none;
margin: 29px 0 0 0;
.video-area{
position: relative;
... ... @@ -910,7 +908,6 @@
}
}
.side-related-posts{
display: none;
margin: 35px 0 0 0;
background: #fff;
h2{
... ... @@ -921,55 +918,56 @@
background-repeat: no-repeat;
background-position: left bottom;
}
}
.side-postslist{
li{
margin: 18px 0 0 0;
a{
display: block;
}
.pic{
position: relative;
float: left;
margin: 3px 0 0 0;
width: 77px;
height: 51px;
img{
width: 100%;
height: 100%;
display: block;
}
.play-icon{
position: absolute;
width: 20px;
height: 19px;
background-image: url("../assets/images/detail/play-icon-s.png");
left: 50%;
top: 50%;
margin: -10px 0 0 -10px;
.postslist{
li{
margin: 18px 0 0 0;
a{
display: block;
}
}
.post-title{
float: left;
width: 155px;
margin: 0 0 0 14px;
h4{
font-weight: bold;
font-size: 14px;
line-height: 14px;
.pic{
position: relative;
float: left;
margin: 3px 0 0 0;
width: 77px;
height: 51px;
img{
width: 100%;
height: 100%;
display: block;
}
.play-icon{
position: absolute;
width: 20px;
height: 19px;
background-image: url("../assets/images/detail/play-icon-s.png");
left: 50%;
top: 50%;
margin: -10px 0 0 -10px;
}
}
p{
font-weight: bold;
margin: 5px 0 0 0;
color: #333;
line-height: 16px;
font-size: 14px;
width: 100%;
.post-title{
float: left;
width: 155px;
margin: 0 0 0 14px;
h4{
font-weight: bold;
font-size: 14px;
line-height: 14px;
}
p{
font-weight: bold;
margin: 5px 0 0 0;
color: #333;
line-height: 16px;
font-size: 14px;
width: 100%;
}
}
}
}
}
.login-box{
position: fixed;
width: 400px;
... ...
.mags-container{
width: 924px;
margin: 0 auto;
.mags-container {
width: 924px;
margin: 0 auto;
}
.newest-mags{
margin: 46px 0 0 0;
.newest-mags {
margin: 46px 0 0 0;
}
<<<<<<< HEAD
.mags-info{
float: left;
width: 546px;
... ... @@ -49,53 +51,101 @@
background-repeat: no-repeat;
}
}
=======
.mags-info {
float: left;
width: 546px;
h2 {
margin: 23px 0 0 0;
height: 70px;
background: url("../assets/images/magazine/mags-title.png") no-repeat center center;
}
.mags-text {
margin: 24px auto 0;
width: 360px;
line-height: 20px;
font-size: 14px;
text-align: center;
color: #444444;
}
.date-price {
margin: 35px 0 0 0;
p {
font-size: 17px;
color: #333333;
text-align: center;
}
.price {
color: #666666;
font-size: 14px;
}
}
.mags-buy {
margin: 18px 0 0 0;
.buy-btn {
display: block;
margin: 0 auto;
width: 137px;
height: 29px;
line-height: 29px;
font-size: 17px;
color: #fff;
text-align: center;
background-image: url("../assets/images/magazine/buy-btn-1024.png");
background-position: center center;
background-repeat: no-repeat;
}
}
>>>>>>> develop
}
.mags-slide{
float: left;
width: 292px;
.slide-box{
width: 100%;
height:366px;
overflow: hidden;
li{
float: left;
width: 292px;
height: 366px;
img{
display: block;
width: 100%;
height: 100%;
}
}
}
.slide-ctrl{
margin: 10px 0 0 0;
text-align: center;
.slide-ctrl-tabs{
display: inline-block;
}
a{
float: left;
margin: 0 0 0 14px;
width: 10px;
height: 10px;
background-image: url("../assets/images/magazine/slide-ctrl-1024.png");
text-indent: -50px;
overflow: hidden;
}
a:first-child{
margin: 0;
}
a.activeSlide{
background-image: url("../assets/images/magazine/slide-ctrl-current-1024.png");
}
a:focus{
outline:none;
}
}
.mags-slide {
float: left;
width: 292px;
.slide-box {
width: 100%;
height: 366px;
overflow: hidden;
li {
float: left;
width: 292px;
height: 366px;
img {
display: block;
width: 100%;
height: 100%;
}
}
}
.slide-ctrl {
margin: 10px 0 0 0;
text-align: center;
.slide-ctrl-tabs {
display: inline-block;
}
a {
float: left;
margin: 0 0 0 14px;
width: 10px;
height: 10px;
background-image: url("../assets/images/magazine/slide-ctrl-1024.png");
text-indent: -50px;
overflow: hidden;
}
a:first-child {
margin: 0;
}
a.activeSlide {
background-image: url("../assets/images/magazine/slide-ctrl-current-1024.png");
}
a:focus {
outline: none;
}
}
}
<<<<<<< HEAD
.column-slide{
margin: 41px 0 0 0;
position: relative;
... ... @@ -254,83 +304,244 @@
}
}
}
=======
.column-slide {
margin: 41px 0 0 0;
position: relative;
.slide-box {
width: 100%;
height: auto;
overflow: hidden;
position: relative;
height: 312px;
.loading-img {
position: absolute;
top: 50%;
left: 50%;
margin: -23px 0 0 -23px;
}
.slide-piclist {
position: relative;
width: 940px;
top: 0;
left: 0;
}
li {
position: relative;
width: 218px;
float: left;
margin: 0 17px 0 0;
.img-wrap {
position: relative;
.border {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
border: 1px solid #ccc;
}
.special-icon {
position: absolute;
left: 0;
top: 0;
width: 36px;
height: 15px;
background: url("../assets/images/magazine/special.png");
}
}
img {
width: 100%;
height: 274px;
display: block;
}
span {
display: block;
margin: 18px 0 0 0;
line-height: 20px;
text-align: center;
font-size: 16px;
color: #000;
font-weight: bold;
}
}
}
.slide-ctrl {
display: none;
a {
position: absolute;
width: 35px;
height: 50px;
top: 38%;
margin-top: -18px;
background-image: url("../assets/images/magazine/slide-ctrl-btn-1024.png");
z-index: 1;
}
a.slide-ctrl-prev {
background-position: 0 0;
left: -46px;
}
a.slide-ctrl-next {
background-position: -35px 0;
right: -50px;
}
}
}
.column-slide.mags-app-download{
margin: 20px 0 0 0;
.slide-box{
height: auto;
li{
img{
width: auto;
margin: 0 auto;
}
span{
margin: 0;
display: block;
font-weight: bold;
font-size: 15px;
line-height: 20px;
text-align: center;
}
h6{
margin: 15px 0 0 12px;
font-size: 22px;
}
p{
margin: 0 0 0 12px;
line-height: 20px;
color: #666666;
font-size: 16px;
}
strong{
display: block;
margin: 22px 0 0 12px;
line-height: 18px;
font-size: 14px;
color: #000;
}
}
li.column-slide01{
img{
width: 170px;
height: 150px;
}
}
li.column-slide02{
img{
margin: 11px 0 0 55px;
width: 170px;
height: 130px;
}
}
li.column-slide03{
img{
width: 129px;
height: 124px;
}
}
}
.column-slide.magazine-list {
.slide-box {
width: 940px;
li {
width: 235px;
margin: 0;
a {
display: block;
width: 218px;
}
}
}
}
.column-slide.rule{
margin: 33px 0 0 0;
h2{
line-height: 48px;
font-size: 24px;
font-weight: bold;
text-align: center;
}
.slide-box{
margin: 11px 0 0 0;
height: 332px;
}
.slide-ctrl{
a{
margin-top: 0;
}
}
.mags-column {
margin: 43px 0 0 0;
h2 {
line-height: 25px;
font-size: 24px;
text-align: center;
color: #000;
font-weight: bold;
}
.column-slide {
margin: 4px 0 20px 0;
h4 {
line-height: 47px;
font-size: 17px;
font-weight: bold;
}
.slide-box {
margin: 0;
height: 362px;
line-height: 362px;
text-align: center;
.slide-piclist {
float: left;
width: 928px;
height: 362px;
}
li {
margin: 0 14px 0 0;
width: 102px;
height: 181px;
.img-wrap {
width: 102px;
height: 153px;
}
img {
width: 102px;
height: 153px;
}
span {
margin: 0;
line-height: 28px;
font-size: 14px;
}
}
}
.slide-ctrl {
a {
top: 50%;
margin-top: -25px;
}
a.slide-ctrl-prev {
background-position: 0 0;
left: -46px;
}
a.slide-ctrl-next {
background-position: -35px 0;
right: -46px;
}
}
}
>>>>>>> develop
}
.column-slide.mags-app-download {
margin: 20px 0 0 0;
.slide-box {
height: auto;
li {
img {
width: auto;
margin: 0 auto;
}
span {
margin: 0;
display: block;
font-weight: bold;
font-size: 15px;
line-height: 20px;
text-align: center;
}
h6 {
margin: 15px 0 0 12px;
font-size: 22px;
}
p {
margin: 0 0 0 12px;
line-height: 20px;
color: #666666;
font-size: 16px;
}
strong {
display: block;
margin: 22px 0 0 12px;
line-height: 18px;
font-size: 14px;
color: #000;
}
}
li.column-slide01 {
img {
width: 170px;
height: 150px;
}
}
li.column-slide02 {
img {
margin: 11px 0 0 55px;
width: 170px;
height: 130px;
}
}
li.column-slide03 {
img {
width: 129px;
height: 124px;
}
}
}
}
.column-slide.rule {
margin: 33px 0 0 0;
h2 {
line-height: 48px;
font-size: 24px;
font-weight: bold;
text-align: center;
}
.slide-box {
margin: 11px 0 0 0;
height: 332px;
}
.slide-ctrl {
a {
margin-top: 0;
}
}
}
<<<<<<< HEAD
/*大图弹层样式*/
.img-zoom {
display: none;
... ... @@ -388,4 +599,58 @@
&.show {
display: block;
}
=======
/*澶у浘寮瑰眰鏍峰紡*/
.img-zoom {
display: none;
position: fixed;
top: 50%;
left: 50%;
z-index: 1000;
&.show {
display: block;
}
.guide-btn {
position: absolute;
width: 20px;
height: 34px;
background-image: url("../assets/images/arrow-girl.png");
background-repeat: no-repeat;
top: 50%;
margin-top: -17px;
&.prev {
left: -112px;
}
&.next {
right: -112px;
background-position: -20px 0;
}
}
}
.magazine-zoom {
width: 600px;
margin-left: -300px;
text-align: center;
img {
max-width: 600px;
}
}
.overlay {
display: none;
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #000;
opacity: 0.6;
filter: alpha(opacity = 60);
z-index: 999;
&.show {
display: block;
}
>>>>>>> develop
}
\ No newline at end of file
... ...