Bootstrap/Html5/Css3 问答社区

bsfanslib 持续更新中

bootstrap3.x • lopo1983 发表了文章 • 0 个评论 • 1381 次浏览 • 2016-07-08 14:10 • 来自相关话题

基于 bootstrap 3.x 的扩展库
终于上线了目前持续书写中！
项目连接地址项目地址coding.io

ajax 加载html

javascript/jQuery • admin 发表了文章 • 0 个评论 • 1935 次浏览 • 2016-07-07 11:56 • 来自相关话题

一、jQuery怎么加载一个html页面到我指定的div里面。我想把a.html里面的某一部份的内容加载到b.html的一个div里。
比如，我要加载a.html里面的<div id=“aContent"></div>这个div里面的所有内容加载到b.html的这个div里<div id="rightCon"></div>
请问要怎么写呢。

用jquery ajax 可以做到
假设 a.html 和b.html在同一目录?
b.html?<script >
$(document).ready(function() {
bodyContent = $.ajax({
url: "b.html",
global: false,
type: "POST",
data: ({
id: this.getAttribute('aContent')
}),
dataType: "html",
async: false,
success: function(msg) {
alert(msg);
}
})
});
</script>

二、juqery $.ajax 请求另一个html页面的指定的“一部分”加载到本页面div，重点是一部分数据加载到本页面div ?(来自百度知道)大至思路如下：$.ajax( {
url: url, //这里是静态页的地址
type: "GET", //静态页用get方法，否则服务器会抛出405错误
success: function(data){
var result = $(data).find("另一个html页面的指定的一部分");
$("本页面div").html(result);

}
});

或参考下面的代码:$(function(){
$.ajax({
type:"POST",
url:"LoginLoadArticle.ashx",
data: "type="+escape("最新公告") ,
success:function(msg){
$(".gonggao").html(msg);
},
error:function(XMLHttpRequest, textStatus, thrownError){}
})

}) 查看全部

一、jQuery怎么加载一个html页面到我指定的div里面。我想把a.html里面的某一部份的内容加载到b.html的一个div里。
比如，我要加载a.html里面的<div id=“aContent"></div>这个div里面的所有内容加载到b.html的这个div里<div id="rightCon"></div>
请问要怎么写呢。

用jquery ajax 可以做到
假设 a.html 和b.html在同一目录?
b.html?

<script >

$(document).ready(function() {

    bodyContent = $.ajax({

        url: "b.html",

        global: false,

        type: "POST",

        data: ({

            id: this.getAttribute('aContent')

        }),

        dataType: "html",

        async: false,

        success: function(msg) {

            alert(msg);

        }

    })

});

</script>

二、juqery $.ajax 请求另一个html页面的指定的“一部分”加载到本页面div，重点是一部分数据加载到本页面div ?(来自百度知道)大至思路如下：

$.ajax( {

        url: url, //这里是静态页的地址

        type: "GET", //静态页用get方法，否则服务器会抛出405错误

        success: function(data){

            var result = $(data).find("另一个html页面的指定的一部分");

            $("本页面div").html(result);





        }

});

或参考下面的代码:

$(function(){

     $.ajax({

            type:"POST",

            url:"LoginLoadArticle.ashx",

            data: "type="+escape("最新公告") ,

            success:function(msg){

                $(".gonggao").html(msg);

            },

            error:function(XMLHttpRequest, textStatus, thrownError){}

        })

     

})

移动端h5，图片手势轮播+手势放大缩小

javascript/jQuery • yinzi 发起了问题 • 1 人关注 • 0 个回复 • 4076 次浏览 • 2016-05-23 17:12 • 来自相关话题

招聘前端

求职招聘 • admin 发表了文章 • 1 个评论 • 1996 次浏览 • 2016-05-31 15:30 • 来自相关话题

岗位职责：
1、负责Web前端表现层及与后端交互的设计和开发；
2、优化网站前端功能设计，解决各种浏览器的兼容性问题；
3、负责前端程序模块开发，通用类库、框架编写；
4、通过各种前端技术手段，提高用户体验并满足性能要求。
5、与软件开发工程师一起研讨技术方案，确定Web系统的接口规范；
6、负责Web前端技术的跟踪和研究，制定代码规范；
7、配合项目经理完成相关任务目标。
任职要求：
1、两年以上前端页面与脚本开发经验；
2、有扎实的前端技术基础，包括但不限于 HTML、CSS、JavaScript、DOM；
3、熟悉常见的前端框架、库、工具，例如：jQuery、AngularJS、Backbone.js、React、Grunt、Gulp 等（angularjs，react至少会用一项）；
4、逻辑分析能力强，善于沟通，较强的学习能力，具备良好的沟通能力和团队协作精神。
上班地址：浦东新区张杨路655号福兴大厦6楼
待遇12-15K
?

邮箱?huangbaiyun@palmyou.com
电话：021-58312426-805

金棕榈人事黄白云?2016/5/31?15:24:58
手机：13818606964?
?
截止日期：2016年6月15日
? 查看全部

简约至上关于前端的交互设计

VUE • lopo1983 发表了文章 • 2 个评论 • 1307 次浏览 • 2016-05-31 12:19 • 来自相关话题

占位

Java招聘

求职招聘 • lopo 发起了问题 • 1 人关注 • 0 个回复 • 2948 次浏览 • 2016-05-27 17:36 • 来自相关话题

modal点击时 body变窄的解决办法

bootstrap3.x • lopo1983 发表了文章 • 0 个评论 • 1846 次浏览 • 2016-03-13 17:02 • 来自相关话题

问题描述
3.x的body在改版为了有更好的UX效果当modal-body 内容超长的时候滚动鼠标即可直接滚动不同于2.x的效果，须在modal-body上滚动鼠标，但是在做某些页面的时候body 的内容不超过100vh 就会出现强制滚动条，而这样的效果在某些时候回引起一些不必要的小麻烦也就是页面重绘。
?
查看bs的源码后发现其在body中增加了一个class modal-open 和通过js 写入的padding-right 17px
从这里下手即可解决
?
解决办法1 简单暴力
修改js 源码
打开js源码搜素 modal 后再搜索 padding 就会发现一个
c.prototype.setScrollbar = function() {
var a = parseInt(this.$body.css("padding-right") || 0, 10);
this.originalBodyPad = document.body.style.paddingRight || "", this.bodyIsOverflowing && this.$body.css("padding-right", a + this.scrollbarWidth)
}注释掉这段js 即可完成；
[b]解决办法2 修改css[/b]
祭出css 大宝剑!important

增加如下css.modal-open {
overflow: initial !important;
}
.body{
adding-right: 0px !important;
}
?
? 查看全部

问题描述
3.x的body在改版为了有更好的UX效果当modal-body 内容超长的时候滚动鼠标即可直接滚动不同于2.x的效果，须在modal-body上滚动鼠标，但是在做某些页面的时候body 的内容不超过100vh 就会出现强制滚动条，而这样的效果在某些时候回引起一些不必要的小麻烦也就是页面重绘。
?
查看bs的源码后发现其在body中增加了一个class modal-open 和通过js 写入的padding-right 17px
从这里下手即可解决
?
解决办法1 简单暴力
修改js 源码
打开js源码搜素 modal 后再搜索 padding 就会发现一个

c.prototype.setScrollbar = function() {

		var a = parseInt(this.$body.css("padding-right") || 0, 10);

		this.originalBodyPad = document.body.style.paddingRight || "", this.bodyIsOverflowing && this.$body.css("padding-right", a + this.scrollbarWidth)

}

注释掉这段js 即可完成；

[b]解决办法2 修改css[/b]

祭出css 大宝剑!important



增加如下css

.modal-open {

    overflow: initial !important;

}

.body{

    adding-right: 0px !important;

}

?

requirejs AMD规范的问题

javascript/jQuery • Qiu 发起了问题 • 1 人关注 • 0 个回复 • 2800 次浏览 • 2016-03-10 16:38 • 来自相关话题

datetimepicker bs中错位问题

bootstrap3.x • lopo1983 发表了文章 • 0 个评论 • 2060 次浏览 • 2016-02-26 10:17 • 来自相关话题

解决方式如同：

datepicker position #363

但是这个文章并没有交代自己的版本号，而且我查找js源文件，也没有找到对应的字眼：507行、scrollTop等。

我个人是2015-11-16在github上下载的master分支：https://github.com/smalot/bootstrap-datetimepicker

根据更新日志，理论上应该是最新的版本?Minor release 2.3.5：Minor release 2.3.5

我找到的位置是在533行

现总结如下：

如果是2.3.5版本，尝试修改?bootstrap-datetimepicker.js?文件?533行?：top = top - containerOffset.top;//改为top = top// - containerOffset.top;
如果没有找到这一行，那么可能是旧版本，尝试在507~520行之间修改：top = top + document.body.scrollTop//改为top = top //+ document.body.scrollTop
如果用的min文件，那么也要相应改一下。讲到这里，再罗嗦一句：

min不知道用什么压缩工具的（估计是google压缩），变量名都改了，查找如下内容：

m=m-k.top;

把 "-k.top"去掉就好。

如果没有找到这个，搜索?top-left 这个字眼，翻一下后面，就可以看到了。

---------------------------------

更新：

俺发现不是这样的捏，min文件里面居然有+document.body.scrollTop这个字眼，果断去掉就好了。

? 查看全部

bootstrap tab 问题集锦

bootstrap3.x • lopo1983 发表了文章 • 0 个评论 • 1725 次浏览 • 2016-02-26 10:07 • 来自相关话题

1.Q:在tab中使用canvas 图标切换时canvas不能正常显示（echarts）本小结由四川-逮猫高手在成都提供 ?
?A：
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
myChart1.resize();
myChart2.resize();
myChart3.resize();
})?
?
? 查看全部

1.Q:在tab中使用canvas 图标切换时canvas不能正常显示（echarts）本小结由四川-逮猫高手在成都提供 ?
?A：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {

    myChart1.resize();

     myChart2.resize();

     myChart3.resize();

})

?
?
?

通知设置新通知

发现