新问题反馈样式;侧导航课程、班级名称长度js控制

This commit is contained in:
Tim 2016-09-14 15:05:08 +08:00
parent 0444904904
commit ffedecab7a
4 changed files with 196 additions and 185 deletions

View File

@ -1,40 +1,49 @@
<%= javascript_include_tag "feedback" %>
<div class="scrollsidebar" id="scrollsidebar">
<div class="scrollsidebar pr" id="scrollsidebar">
<div class="side_content">
<div class="side_list">
<div style="background-color:#fff; padding:10px 0; border:1px solid #aaa; border-bottom:none; border-top-left-radius:15px; border-top-right-radius:15px;">
<img src="/images/dialog.png" width="30" class="ml10" />
<span class="fontGrey3 f14 ml5" style="vertical-align:top;">问题和建议</span>
<a title="<%= l(:button_hide) %>" class="close_btn" style="margin-top:3px;"></a> </div>
<div style="background-color:#fff; padding:10px 0; border:1px solid #aaa; border-bottom:none;">
<span class="fontGrey3 f14 ml40" style="vertical-align:top;">问题和建议</span>
<span class="hide-side-bar side-bar-circle fr mt3 mr10" title="关闭"><span class="side-bar-content">×</span></span>
<span class="close_btn side-bar-circle fr mt3 mr10" title="隐藏"><span class="side-bar-content" style="left:4px;"></span></span>
</div>
<div style="background-color:#fff; border-left:1px solid #aaa; border-right:1px solid #aaa;">
<div class="custom_service tac">
<% get_memo %>
<%= form_for(@new_memo, :url => create_feedback_forum_path(@public_forum)) do |f| %>
<%= f.text_area :subject, :id=>"subject", :class => "opnionText", :placeholder => l(:label_feedback_tips) %>
<%= f.text_area :subject, :id=>"subject", :class => "opnionText mb5", :placeholder => l(:label_feedback_tips) %>
<%= f.hidden_field :content,:id => 'hidden', :required => true , :value => l(:label_feedback_value) %>
<p class="c_grey">还能输入<span id="textCount" class="c_orange">50</span>个字符</p>
<a href="javascript:void(0);" class="linkBlue f14 mb5" style="height:21px; display:block;" id="" onclick="f_submit();">
<span class="c_grey fl ml10">还能输入<span id="textCount" class="c_orange">50</span>个字符</span>
<a href="javascript:void(0);" class="linkBlue f14 fr mr10" style="height:21px;" id="" onclick="f_submit();">
<%= l(:label_submit)%>
</a>
<div class="cl"></div>
<% end %>
</div>
<div class="mt5" style="cursor:default; border-top:1px solid #aaa; border-bottom:1px solid #aaa; padding:5px 0;">
<!--<a target="hiddentab" href="http://wpa.qq.com/msgrd?v=1&uin=1554253403&site=qq&menu=yes" style="color: #269ac9;">-->
<%#= l(:label_technical_support) %>
<!--白&nbsp;&nbsp;&nbsp;羽</a> http://shang.qq.com/wpa/qunwpa?idkey=4fe2d63a4527cddce038f04f0b1d728a62082074fb4a74870a5444ee1a6910ad-->
<!--<p style="text-align: center"> 请加入师姐师兄答疑群</p> <p style="text-align: center"></p>-->
<!--<a href="mqqapi://card/show_pslcard?src_type=internal&version=1&uin=173184401&card_type=group&source=qrcode">QQ群号173184401</a>-->
<img src="/images/QQ_Logo.png" width="30" class="image-cir fl ml30" />
<a target="_blank" href="http://shang.qq.com/wpa/qunwpa?idkey=fb938b1f6f991fc100f3d32b6ef38b7888dd4097c71d0eb8b239eaa8749a6afd" class="fl mt6">加入QQ群</a>
<div class="cl"></div>
</div>
</div>
<div style="background-color:#fff; border:1px solid #aaa; border-top:none; border-bottom-left-radius:15px; border-bottom-right-radius:15px;" class="tac"><img src="/images/wechat/trustie_QR.jpg" width="100" style="display:inline-block;" /><p class="fontGrey3" style="padding-bottom:10px;">关注官方微信</p></div>
<div style="background-color:#fff; border:1px solid #aaa; border-top:none; padding-top:5px;">
<div class="fl mt5 ml10 tac">
<!--<a target="hiddentab" href="http://wpa.qq.com/msgrd?v=1&uin=1554253403&site=qq&menu=yes" style="color: #269ac9;">-->
<%#= l(:label_technical_support) %>
<!--白&nbsp;&nbsp;&nbsp;羽</a> http://shang.qq.com/wpa/qunwpa?idkey=4fe2d63a4527cddce038f04f0b1d728a62082074fb4a74870a5444ee1a6910ad-->
<!--<p style="text-align: center"> 请加入师姐师兄答疑群</p> <p style="text-align: center"></p>-->
<!--<a href="mqqapi://card/show_pslcard?src_type=internal&version=1&uin=173184401&card_type=group&source=qrcode">QQ群号173184401</a>-->
<a target="_blank" href="http://shang.qq.com/wpa/qunwpa?idkey=fb938b1f6f991fc100f3d32b6ef38b7888dd4097c71d0eb8b239eaa8749a6afd"><img src="/images/QQ_Logo.png" width="30" style="cursor:default; border:1px solid #ddd; padding:20px; cursor:pointer;" /></a>
<p class="fontGrey3" style="padding-bottom:10px; padding-top:3px;">加入QQ群</p>
</div>
<div class="fr mr10 tac">
<img src="/images/wechat/trustie_QR.jpg" width="80" style="display:inline-block; margin-right:-5px;" /><p class="fontGrey3" style="padding-bottom:10px;">关注官方微信</p>
</div>
<div class="cl"></div>
</div>
</div>
</div>
<div class="show_btn">
<span><%= l(:label_submit)%></span>
<a href="javascript:void(0)" class="closeSidebar"></a>
<div class="show_btn tac">
<div style=" border:1px solid #aaa;">
<img src="/images/dialog.png" width="18" class="mt10 mb5" />
<span class="f14 fontBlue">提<br />问</span>
<span class="closeSidebar f16" style="margin-top:8px;">×</span>
</div>
</div>
</div>

View File

@ -107,10 +107,15 @@
$(".course_list_menu").each(function(){
var courseWidth = $(this).children().eq(0).width();
var classWidth = 170 -courseWidth;
var classWidth = $(this).children().eq(2).width();
var newClassWidth = 170 - courseWidth;
var newCourseWidth = 170 - classWidth;
console.log(courseWidth, classWidth);
if(courseWidth < 80){
$(this).children().eq(2).css("max-width",classWidth + "px");
if(courseWidth < 80 && classWidth > 80){
$(this).children().eq(2).css("max-width",newClassWidth + "px");
}
if(classWidth < 80 && courseWidth > 80){
$(this).children().eq(0).css("max-width",newCourseWidth + "px");
}
})
</script>

View File

@ -1,148 +1,148 @@
(function($){
$.fn.fix = function(options){
var u = navigator.userAgent;
if((u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 ||u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1)){
$("#scrollsidebar").css("display","none");
return;
}
var defaults = {
float : 'right',
minStatue : true,
skin : 'blue',
durationTime : 1000
};
var options = $.extend(defaults, options);
this.each(function(){
//???????
var thisBox = $(this),
closeBtn = thisBox.find('.close_btn' ),
show_btn = thisBox.find('.show_btn' ),
sideContent = thisBox.find('.side_content');
var defaultTop = thisBox.offset().top; //????????top
thisBox.css(options.float, 0);
if(options.minStatue == "true"){
show_btn.css("float", options.float);
sideContent.css('width', 0);
show_btn.css('width', 28);
}
//close
closeBtn.bind("click",function(){
sideContent.animate({width: '0px'},"fast");
show_btn.stop(true, true).delay(300).animate({ width: '28px'},"fast");
cookiesave('minStatue','true','','','');
});
//show
show_btn.bind("click",function() {
$(this).animate({width: '0px'},"fast");
sideContent.stop(true, true).delay(200).animate({ width: '154px'},"fast");
cookiesave('minStatue','false','','','');
});
}); //end this.each
};
})(jQuery);
function f_submit()
{
$("#new_memo").submit();
}
function cookiesave(n, v, mins, dn, path)
{
if(n)
{
if(!mins) mins = 365 * 24 * 60;
if(!path) path = "/";
var date = new Date();
date.setTime(date.getTime() + (mins * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
if(dn) dn = "domain=" + dn + "; ";
document.cookie = n + "=" + v + expires + "; " + dn + "path=" + path;
}
}
function cookieget(n)
{
var name = n + "=";
var ca = document.cookie.split(';');
for(var i=0;i<ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(name) == 0){
return c.substring(name.length,c.length);
}
}
return false;
}
$(function(){
var u = navigator.userAgent;
if((u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 ||u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1)){
$("#scrollsidebar").css("display","none");
return;
}
$(".closeSidebar").click(function(){
$(".show_btn").css("display","none");
$("#scrollsidebar").css("display","none");
return false;
});
$("#button1").click(function(){
myTips("反馈成功","success");
});
$("#scrollsidebar").fix({
float: 'right', //default.left or right
minStatue: cookieget('minStatue'),
skin: 'green', //default.gray or blue
durationTime: 600
});
$("#subject").keydown(function(){
var curLength=$("#subject").val().length;
if(curLength>50){
var num=$("#subject").val().substr(0,50);
$("#subject").val(num);
}
else{
$("#textCount").text(50-$("#subject").val().length)
}
}).keyup(function(){
var curLength=$("#subject").val().length;
if(curLength>50){
var num=$("#subject").val().substr(0,50);
$("#subject").val(num);
}
else{
$("#textCount").text(50-$("#subject").val().length)
}
});
});
//var browser={
// versions:function(){
// var u = navigator.userAgent, app = navigator.appVersion;
// return {//移动终端浏览器版本信息
// trident: u.indexOf('Trident') > -1, //IE内核
// presto: u.indexOf('Presto') > -1, //opera内核
// webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
// gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
// mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否为移动终端
// ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
// android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
// iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器
// iPad: u.indexOf('iPad') > -1, //是否iPad
// webApp: u.indexOf('Safari') == -1 //是否web应该程序没有头部与底部
// };
// }(),
// language:(navigator.browserLanguage || navigator.language).toLowerCase()
//}
//document.writeln("语言版本: "+browser.language);
//document.writeln(" 是否为移动终端: "+browser.versions.mobile);
//document.writeln(" ios终端: "+browser.versions.ios);
//document.writeln(" android终端: "+browser.versions.android);
//document.writeln(" 是否为iPhone: "+browser.versions.iPhone);
//document.writeln(" 是否iPad: "+browser.versions.iPad);
(function($){
$.fn.fix = function(options){
var u = navigator.userAgent;
if((u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 ||u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1)){
$("#scrollsidebar").css("display","none");
return;
}
var defaults = {
float : 'right',
minStatue : true,
skin : 'blue',
durationTime : 1000
};
var options = $.extend(defaults, options);
this.each(function(){
//???????
var thisBox = $(this),
closeBtn = thisBox.find('.close_btn' ),
show_btn = thisBox.find('.show_btn' ),
sideContent = thisBox.find('.side_content');
var defaultTop = thisBox.offset().top; //????????top
thisBox.css(options.float, 0);
if(options.minStatue == "true"){
show_btn.css("float", options.float);
sideContent.css('width', 0);
show_btn.css('width', 28);
}
//close
closeBtn.bind("click",function(){
sideContent.animate({width: '0px'},"fast");
show_btn.stop(true, true).delay(300).animate({ width: '28px'},"fast");
cookiesave('minStatue','true','','','');
});
//show
show_btn.bind("click",function() {
$(this).animate({width: '0px'},"fast");
sideContent.stop(true, true).delay(200).animate({ width: '180px'},"fast");
cookiesave('minStatue','false','','','');
});
}); //end this.each
};
})(jQuery);
function f_submit()
{
$("#new_memo").submit();
}
function cookiesave(n, v, mins, dn, path)
{
if(n)
{
if(!mins) mins = 365 * 24 * 60;
if(!path) path = "/";
var date = new Date();
date.setTime(date.getTime() + (mins * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
if(dn) dn = "domain=" + dn + "; ";
document.cookie = n + "=" + v + expires + "; " + dn + "path=" + path;
}
}
function cookieget(n)
{
var name = n + "=";
var ca = document.cookie.split(';');
for(var i=0;i<ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(name) == 0){
return c.substring(name.length,c.length);
}
}
return false;
}
$(function(){
var u = navigator.userAgent;
if((u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 ||u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1)){
$("#scrollsidebar").css("display","none");
return;
}
$(".closeSidebar, .hide-side-bar").click(function(){
$(".show_btn").css("display","none");
$("#scrollsidebar").css("display","none");
return false;
});
$("#button1").click(function(){
myTips("反馈成功","success");
});
$("#scrollsidebar").fix({
float: 'right', //default.left or right
minStatue: cookieget('minStatue'),
skin: 'green', //default.gray or blue
durationTime: 600
});
$("#subject").keydown(function(){
var curLength=$("#subject").val().length;
if(curLength>50){
var num=$("#subject").val().substr(0,50);
$("#subject").val(num);
}
else{
$("#textCount").text(50-$("#subject").val().length)
}
}).keyup(function(){
var curLength=$("#subject").val().length;
if(curLength>50){
var num=$("#subject").val().substr(0,50);
$("#subject").val(num);
}
else{
$("#textCount").text(50-$("#subject").val().length)
}
});
});
//var browser={
// versions:function(){
// var u = navigator.userAgent, app = navigator.appVersion;
// return {//移动终端浏览器版本信息
// trident: u.indexOf('Trident') > -1, //IE内核
// presto: u.indexOf('Presto') > -1, //opera内核
// webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
// gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
// mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否为移动终端
// ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
// android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
// iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器
// iPad: u.indexOf('iPad') > -1, //是否iPad
// webApp: u.indexOf('Safari') == -1 //是否web应该程序没有头部与底部
// };
// }(),
// language:(navigator.browserLanguage || navigator.language).toLowerCase()
//}
//document.writeln("语言版本: "+browser.language);
//document.writeln(" 是否为移动终端: "+browser.versions.mobile);
//document.writeln(" ios终端: "+browser.versions.ios);
//document.writeln(" android终端: "+browser.versions.android);
//document.writeln(" 是否为iPhone: "+browser.versions.iPhone);
//document.writeln(" 是否iPad: "+browser.versions.iPad);
//document.writeln(navigator.userAgent);

View File

@ -118,33 +118,30 @@ a.resourcesTypeUser {background:url(../images/homepage_icon.png) -178px -453px n
/*意见反馈*/
html{ overflow-x:hidden;}
.scrollsidebar{ position: fixed; bottom:1px; right:1px; background:none; }
.side_content{width:152px; height:auto; overflow:hidden; float:left;}
.side_content .side_list {width:152px;overflow:hidden;}
.show_btn{ width:0; height:112px; overflow:hidden; float:left; margin-top:200px; cursor:pointer;}
.show_btn span { display:none;}
.close_btn{width:24px;height:24px;cursor:pointer;}
.side_title,.side_bottom,.close_btn,.show_btn {background:url(/images/sidebar_bg.png) no-repeat; }
.side_content{width:180px; height:auto; overflow:hidden; float:left;}
.side_content .side_list {width:180px;overflow:hidden;}
.show_btn{ width:0; height:100px; overflow:hidden; float:left; margin-top:200px; cursor:pointer; background-color:#fff;}
.close_btn{cursor:pointer;}
.side_title,.side_bottom {background:url(/images/sidebar_bg.png) no-repeat; }
.side_title {height:35px;}
.side_bottom { height:8px;}
.side_center {font-family:Verdana, Geneva, sans-serif; padding:0px 12px; font-size:12px;}
.close_btn { float:right; display:block; width:21px; height:16px; margin:9px 10px 0 0; _margin:16px 5px 0 0;}
.close_btn span { display:none;}
.side_center .custom_service p { text-align:center; padding:6px 0; margin:0; vertical-align:middle;}
.msgserver { margin:10px 0 0px 5px;}
.msgserver a { background:url(/images/sidebar_bg.png) no-repeat -119px -110px; padding-left:22px; display:block; height:24px; }
.opnionText{box-shadow:none; width:122px; height:180px; border-color: #DFDFDF; background:#fff; color:#999; padding:3px; font-size:12px;overflow:auto; background-attachment:fixed;border-style:solid;}
.opnionText{box-shadow:none; width:150px; height:180px; border-color: #DFDFDF; background:#fff; color:#999; padding:3px; font-size:12px;overflow:auto; background-attachment:fixed;border-style:solid;}
a.opnionButton{ display:block; background:#269ac9; width:130px; height:26px; margin-top:5px; text-align:center; padding-top:0px; color:#fff;}
a.opnionButton:hover{background: #297fb8; }
/* blue skin as the default skin */
.side_title {background-position:-195px 0;}
.side_center {background:url(/images/blue_line.png) repeat-y center; }
.side_bottom {background-position:-195px -50px;}
.close_btn {background-position:-44px 0;}
.close_btn:hover {background-position:-66px 0;}
.show_btn {background-position:-119px 0;}
.msgserver a {color:#269ac9; }
.msgserver a:hover { text-decoration:underline; }
.closeSidebar {background:url(/images/sidebar_bg.png) 0px -112px no-repeat; width:28px; height:18px; margin-top:65px; position:absolute;}
.closeSidebar {width:26px; height:18px; line-height:18px; vertical-align:middle; border-top:1px solid #aaa; color:#aaa; display:block;}
.side-bar-circle {width:13px; height:13px; font-size:14px; color:#aaa; border:1px solid #aaa; border-radius:50%; display:block; font-weight:bold; position:relative; cursor:pointer;}
.side-bar-content {position:absolute; top:-5px; left:1px;}
.hiddent{ overflow:hidden; white-space: nowrap; text-overflow:ellipsis;}