草庐IT

CSS定位div

全部标签

javascript - "scroll"到css修改输入值后输入结束

我有一个该用户写入,有时使用字典中的建议。选择建议后,我会:varinput=$('#inp');input.val(input.val()+suggestedText+'');input.focus();//thatisbecausethesuggestcanbeselectedwithmouse一切都很好,但是在添加一个建议后,结果是input.val()太长而无法容纳在编辑字段中,光标位于字符串的末尾(这很好),但在编辑字段中只有字符串的开头可见,因此光标也被隐藏了。只要按下一个键(一个改变值的键),“滚动”就会转到字符串的末尾,隐藏开头...如何自动触发此行为,而无需按键?我找

javascript - 在靠近底部的地方拖动时在可移动的 DIV 内部滚动

我在一个可滚动的div中有多个可拖动的div。当我将它们拖入可放置区域(这也是一个可滚动的div)时,可放置的DIV不会向下滚动。只是页面在移动。怎么说,只有可放置的div应该在拖动时滚动?这是我当前用于使div可拖动的jquery代码$(".drag_item").draggable({helper:'clone',scroll:true,drag:function(event,ui){$(this).css('z-index','100');}}); 最佳答案 我想到了这个解决方案:vardirection={};varboun

javascript - 附加的 div 无法滚动

在谷歌浏览器中,我附加了一个div。当我点击按钮时,红色的div会滑出,但它不能用鼠标滚轮滚动。该错误只发生在谷歌浏览器中。这是一个示例页面:http://infinitynewtab.com/question/test.htmlhtml、css和js:body{margin:0px;overflow:hidden;}#right{width:350px;height:100%;position:absolute;top:0px;right:-350px;background-color:red;overflow-y:scroll;}#button{width:180px;height

javascript - 隐藏 div 是否会停止动画(CSS 或 JS)?

将任何基于CSS的加载器动画作为引用。通常,当某些回调函数执行成功时,div会被隐藏,以表明结果已经到达。我的问题是,隐藏div实际上会停止动画吗?或者它们是否仍在继续耗尽CPU周期?非CSS动画呢? 最佳答案 长话短说Myquestionis,doeshidingthedivactuallystoptheanimation?OrdothosestillcontinuetouseupCPUcycles?不确定动画状态是如何在内部定义的,但它一旦隐藏就不会使用CPU周期。Whataboutnon-CSSanimations?CPU周期

javascript - 如何向 div 的所有子节点和这些 div 的数组添加事件监听器?

我正在自学JS并尽量避免使用jQuery,直到我的JS技能更好。目标:为某个类的所有div添加一个事件监听器,用于点击事件。让该类的所有子节点响应该事件。我的HTMLcss3tamberator我使用这个JS选择了所有的.grid-paneldivvargridPanels=document.querySelectorAll('.grid-panel');然后,因为它返回一个类为.grid-panel的div数组我为点击添加事件监听器for(i=0;i我的功能是这样的myFunction(){vare=event.target;switch(e){casegridPanels[0]:m

javascript - d3 图表显示在 bootstrap div 之外

我遇到了一个问题,即在d3中,每个选择器选择的条形图都在div区域之外生成。varsvg=d3.select("#barchart").append("svg").attr("width",width+margin.left+margin.right).attr("height",height+margin.top+margin.bottom).append("g").attr("transform","translate("+margin.left+","+margin.top+")");可以在下面的jsbin位置找到完整的代码http://jsbin.com/sodivamiqa/

javascript - 如何设计一个监听 WebSocket 并与 CSS 动画交互的 ReactJS 组件

ReactJS组件需要监听WebSocket发出的事件。对于每个入站事件,组件应该呈现一个DOM节点。然后它应该等待与DOM节点关联的CSS动画完成,然后删除DOM节点。这是我打算实现的草图。这种方法看起来可行吗?setTimeout感觉很糟糕。classMyComponentextendsReact.PureComponent{componentDidMount(){this.props.webSocket.on('myEvent',componentDidReceiveEvent)}componentWillUnmount(){this.props.webSocket.off('m

javascript - 是否可以让 Chrome 返回 CSS "content"属性的原始值?

考虑以下JavaScript、CSS和HTML代码:console.log(getComputedStyle(document.querySelector('p'),'::after').getPropertyValue('content'));p::after{content:"Hello"attr(data-after);}Firefox和IE11都返回CSS中定义的原始值:"Hello"attr(data-after),这正是我所需要的。但是Chrome返回"HelloWorld",解析后的值。当我使用ChromeDevTools检查元素时,我可以看到它在“样式”面板中显示以下信

javascript - 检测并记录外部 JavaScript 或 CSS 资源无法加载的时间

我有多个对外部js和css资源的引用。大多数情况下,这些用于第三方分析等。有时(传闻)这些资源无法加载,通常会导致浏览器超时。是否可以在外部JavaScript或CSS资源加载失败时检测并登录服务器?我正在考虑某种类型的延迟加载机制,当失败时,将调用一个特殊的URL来记录此失败。有什么建议吗?我认为会发生什么:用户点击我们的页面,服务器端成功处理并提供页面在客户端,HTMLheader尝试连接到我们的第3方集成合作伙伴,通常通过以“http://www.someothercompany.com...”开头的javascript包含。其他公司无法处理我们的负载或正常运行时间很差,因此连接

javascript - CSS 和 JavaScript : Get a list of CSS custom attributes

来自这段代码:HTMLCSS.test{background-color:red;font-size:20px;-custom-data1:value1;-custom-data2:150;-custom-css-information:"loremipsum";}使用javascript——例如从$('.test')——我如何才能得到一个CSS属性列表,其属性名称以前缀“-custom-”开头“?(他们可以有不同的名字,但总是相同的前缀)我想得到这个:{customData1:"value1",customData2:150,customCssInformation:"loremip