Tag: 布局

所有其他浏览器的CSS,但IE

我遇到的问题是我有一个简单的浮动布局,其中一个内容div安装了s3slider插件 它在Internet Explorer中运行良好,但所有其他浏览器(chrome,ff,opera)的左边距约为40px,上边距约为15px。 我可以弄明白为什么所以我想知道是否有办法添加左:-40px; 顶部:-15px; 只能由IE浏览器阅读。 另一个问题是滑块的宽度宽度小于其在IE中完美匹配的容器。 我还没有找到解决方法。 主要CSS: @charset “utf-8”; /* CSS Document */ body{ font-size:12px; font-family:Verdana, Geneva, sans-serif; background:#AECF76; padding:0px; margin:0px; } input[type=submit]{ float:right; padding:10px; font-size:14px; background:#595959; border:0px; color:#E4EFD1; font-weight:bold; margin-top:10px; -moz-border-radius:4px; } input[disabled=disabled] { border:0px; background:0px; } input[disabled] { border:0px; background:0px; } .edit { border:1px solid red; background:#FFF; color:#333; font-weight:bold; margin-right:5px; padding:5px; […]

jquery通过ajax加载脚本

一些设置: 我有一个网站,允许用户运行报告并获得结果。 该网站使用jquery布局来创建北,南,西和中心div。 North有标题和导航菜单,南有页脚信息,西有报告链接列表,中心显示报告结果(中心最初为空白)。 报告数据使用DataTables插件以表格forms显示。 为了简化示例目的,所有报告数据都在单个ajax调用中返回,然后呈现为DataTable。 所以示例流程如下: main.html中: 负载 加载jquery,布局和数据表 使用页眉,菜单,页脚和报告链接设置布局。 中心留空。 用户: 单击“Report-1”链接。 main.html中: 调用jquery.load(“report1.html”)。 (通常report1将是一个PHP脚本) 这将返回包含数据的报表表并加载到Center div中。 注意:返回的内容是html和js。 假设将使用在main.html中加载的DataTables插件。 因此,报表内容中不包含任何数据表负载。 加载的js代码使用名称空间“CenterContent”并具有Initialize()函数 在成功加载时,调用initialize()执行$(“#report1”)。datatable()。 用户 愉快地回顾一个漂亮的数据表中的数据 这一切都适用于Firefox,Chrome,Safari和大多数IE。 然而,在最新的IE(10.0.9200.16750)中似乎发生了一些变化 – 以前版本的IE(10.0.9200.16580)工作正常。 我现在对最新的IE有一些问题 – 调用Initialize()时不会呈现DataTable并且获取“Object不支持属性或方法’dataTable’” 我创建了一些示例文件并进行了一些测试。 我发现如果report1.html包含一个包含DataTables插件的脚本标记(因此当ajax加载发生时强制加载DataTables) – 最新的IE按预期工作。 (注意:当DataTables脚本标记从main.html移动到report1.html时 – 它必须从与main.html相同的域加载.AFAIK,从另一个域加载是ajax违规并且在脚本时似乎有效标签是在ajax加载的内容。) 我可以将DataTable插件加载到报表响应中,但这意味着插件将在每次报表运行时加载。 似乎浪费时间和精力。 当用户在报告之后运行报告时,这是否会产生任何不区分? 对于这种食谱,有一些“最佳实践”吗? 为什么最新的IE会抛出此错误? 而不是以前的IE? 我在IE的MS公告中找不到任何解释( http://support.microsoft.com/kb/2898785 ) 下面是我的两个示例文件。 非常感谢任何帮助/建议/指针。 main.html和report1.html main.html中 // Set […]

如何在固定位置使用jQuery draggable?

它在firefox中运行得很完美,但是在chrome和opera中它不起作用。 has position:fixed, and is .draggable() 它除了firefox之外不起作用

水平滚动布局左/右:jQuery / CSS测验

看来,我想要实现的目标几乎是不可能的。 我试图创建一个依赖于jQuery的水平布局 ,但即使关闭Javascript也可以使用。 我还希望保留最清晰的代码并保持其语义值。 所以我想我正在寻找终极解决方案。 🙂 网络上最常见的水平布局是: http : //www.queness.com/resources/html/scroll/horizo​​ntal.html – 这将是完美的(即使关闭JS也能正常工作)。 我的问题是我需要让它“双向”工作(左右两侧带有“开始”项目)。 效果应该类似于: http : //steveandjacqs.com/网站(和编码后端)很棒,但没有JS它就无法使用,而且代码充满了黑客攻击。 我的CSS: html,body { overflow: hidden; } .wrapper { position: relative; width: 100%; height: 100%; } .wrapper-cont { position: relative; width: 500%; height: 100%; margin-left: -200%; } #item-left { position: absolute: top: 0px; left: 0%; } #item-home { position: […]

应用所有CSS规则后执行jQuery代码

$(document).ready()在加载所有HTML元素时执行代码。 如何在应用所有CSS规则后执行jQuery代码? 我有很少的样式表链接到页面,加载页面需要一些时间。 元素布局在加载期间发生更改。 出于可用性目的,我需要在所有元素布局都具有目标大小后更正它。 否则我得到这些元素的错误大小。 现在我在焦点或一些超时之后做,但在页面加载后需要这个。

如何在开发网站时处理不同的屏幕分辨率/屏幕尺寸?

我想使用jQuery开发一个可以与所有主流浏览器一起使用的网站。 我想从一个基本布局开始(一个标题,一些包含内容的标签和页脚)。 我想知道如何创建此布局以支持不同的屏幕分辨率,屏幕大小或窗口大小。 在定义组件的宽度和高度时,我应该以像素/点/百分比工作吗? 是否有任何jQuery插件可以帮助我完成这项任务? 谢谢 !

ckeditor图像对齐中心定制

在研究了关于ckeditor的图像居中的至少十几个主题后,我想发布我用于我们公司应用程序的内容,看看是否有其他极客有提示或改进建议。 我在stackoverflow上发布这个,因为它是我们都寻求帮助的地方,我知道其他人正在研究这个相同的主题。 我们的编辑器用于电子邮件模板,因此我想确保样式属性也重新插入到img标记属性中: 在文件最底部的ckeditor.js文件中添加以下代码块。 如果您使用的是未压缩的js文件,请确保您位于文件的最后。 我添加了一个评论块以确定。 //————————————————————————————————————————————————————————————————– function configureHtmlOutput( ev ) { var editor = ev.editor, dataProcessor = editor.dataProcessor, htmlFilter = dataProcessor && dataProcessor.htmlFilter; // Out self closing tags the HTML4 way, like . dataProcessor.writer.selfClosingEnd = ‘>’; // Make output formatting behave similar to FCKeditor var dtd = CKEDITOR.dtd; for ( var e in CKEDITOR.tools.extend( […]

缩略图库的布局理论

我正在创建一个完全像这样的缩略图库( http://tmv.proto.jp/#!/destroyftw )。 目前我正在尝试制定脚本理论。 网页的实际脚本在这里( http://tmv.proto.jp/tmv_v3.js )。 因为我对javascript相对较新,这让我有点沮丧。 我已经尝试过使用砌体和同位素等插件,但是它们无法处理大量的图像。 更不用说无限滚动不适用于我需要的过滤。 所以我决定尝试自己编码。 这个想法是用户提交的图像将被调整为具有设定宽度的缩略图(当然,高度将被缩放以保持纵横比)。 然后这些缩略图将用于创建图库。 我遇到的问题是,我发现布局有点棘手。 看来该页面首先被分成列以形成第一个“行”。 之后,缩略图放在最左边最短的列中(具体来说,我想知道这种特殊图像定位技术背后的理论)。 例如 :数字也可以理解为图像的ID。 (ID = “I_1” ID = “I_2”等) 这也会导致页面加载的级联淡入效果以及附加新图像时(它们根据其ID简单地淡入)。 我试图使用上面的脚本页面作为参考无济于事。 但是如果有人想自己检查我认为负责缩略图定位的function是在“ViewManager”下。 重申一下,我不是在寻找有人为我做我的工作。 我只是需要帮助制定理论,所以我将有一个开始的地方。 **Note**(In the script): cellSize= 100; cellMargin=1; doubleSize=201 (cellSize*2+cellMargin); totalCellSize=101 (cellSize+cellMargin);

如何在jQueryMobile中的页面之间保持相同的页眉/页脚?

在导航jQueryMobile页面时,有一种简单的方法来保持相同的页眉/页脚吗? 到目前为止我遇到的唯一解决方案依赖于在页面更改时动态地注入它,但是这会破坏过渡,只是克隆元素,我需要原始。 那么有官方支持的方式吗? 我觉得很奇怪,我似乎是唯一一个在这个问题上挣扎的人?

使用jQuery计算Children的总宽度

我试过找到一个可以理解的答案,但放弃了。 为了在横向网站 (如thehorizo​​ntalway.com )上拥有dymnamic内容(如博客文章和图片),你必须为像素中的BODY设置一个固定的宽度,对吧? 因为你在其中使用浮动元素,否则会破坏和包裹页面,具体取决于浏览器的宽度。 编辑! 这个特定的值可以用jQuery 计算 ,多亏了:)在这个例子中,一个额外的值被添加到总大小,可以用于浮动元素之前的内容。 现在身体得到了动态的宽度! 我最初的想法是让jQuery为我们计算:(’每个post宽度’*’号码数’)+ 250(额外内容) HTML代码 Lorem Lorem Lorem Lorem … Alconja的结果和答案 $(document).ready(function() { var width = 0; $(‘.post’).each(function() { width += $(this).outerWidth( true ); }); $(‘body’).css(‘width’, width + 250); }); 非常感谢!