相关疑难解决方法(0)

仅使用CSS定位Firefox

使用条件注释很容易使用特定于浏览器的CSS规则来定位Internet Explorer:

<!--[if IE 6]>
...include IE6-specific stylesheet here...
<![endif]-->
Run Code Online (Sandbox Code Playgroud)

有时,Gecko引擎(Firefox)行为不端.使用CSS规则而不是单个其他浏览器仅针对Firefox的最佳方法是什么?也就是说,Internet Explorer不仅应该忽略Firefox规则,还应该忽略WebKit和Opera.

注意:我正在寻找一个"干净"的解决方案.在我看来,使用JavaScript浏览器嗅探器向我的HTML添加"firefox"类并不符合要求.我宁愿看到一些取决于浏览器功能的东西,就像条件评论只对IE有"特殊"...

css firefox css-hack

595
推荐指数
8
解决办法
55万
查看次数

CSS滚动条样式跨浏览器

如何定义CSS滚动条样式跨浏览器?我测试了这段代码,它只适用于IE和Opera,但在Chrome,Safari和Firefox中失败了.

<style type="text/css">
<!--    
body {
    scrollbar-face-color: #000000;
    scrollbar-shadow-color: #2D2C4D;
    scrollbar-highlight-color:#7D7E94;
    scrollbar-3dlight-color: #7D7E94;
    scrollbar-darkshadow-color: #2D2C4D;
    scrollbar-track-color: #7D7E94;
    scrollbar-arrow-color: #C1C1D1;
}
-->
</style>
Run Code Online (Sandbox Code Playgroud)

css scrollbar

159
推荐指数
4
解决办法
59万
查看次数

如何获得浏览器的滚动条大小?

如何在JavaScript中确定水平滚动条的高度或垂直滚动​​条的宽度?

javascript scrollbar

157
推荐指数
10
解决办法
15万
查看次数

在800px之后在scrollDown上显示div

我希望在从页面顶部向下滚动800px后显示隐藏的div.到目前为止我有这个例子,但我想它需要修改才能实现我想要的东西.

编辑:

[当scrollUp和高度小于800px时,这个div应隐藏]

HTML:

<div class="bottomMenu">
  <!-- content -->
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.bottomMenu {
    width: 100%;
    height: 60px;
    border-top: 1px solid #000;
    position: fixed;
    bottom: 0px;
    z-index: 100;
    opacity: 0;
}
Run Code Online (Sandbox Code Playgroud)

jQuery的:

$(document).ready(function() {
    $(window).scroll( function(){
        $('.bottomMenu').each( function(i){
            var bottom_of_object = $(this).position().top + $(this).outerHeight();
            var bottom_of_window = $(window).scrollTop() + $(window).height();
            if( bottom_of_window > bottom_of_object ){
                $(this).animate({'opacity':'1'},500);
            }
        }); 
    });
});
Run Code Online (Sandbox Code Playgroud)

这是我当前代码的小提琴.

html css jquery

66
推荐指数
2
解决办法
22万
查看次数

令人满意的单行输入

对于我在我工作的公司开发的应用程序,我们需要一个支持在基于JS的Web应用程序中插入表情符号的输入.我们目前正在使用带有表情符号短代码(即':-)')的输入,并希望切换到插入实际的图形图像.

我们最初的计划是使用contenteditable <div>.我们正在使用监听器来执行粘贴事件以及不同的键/鼠标交互,以确保没有不需要的标记进入contenteditable(我们从其容器标签中删除文本并仅留下我们自己插入的图像标签).

但是,现在的问题是如果你输入足够的内容(即它的高度增加),div会调整大小.我们不希望这种情况发生,文本只是被隐藏(即普通overflow: hidden)也是不可接受的.所以:

有没有办法让contenteditable div表现得像单行输入?

我最喜欢,如果有一个相对简单的属性/ css属性,我错过了将做我想要的,但如果有必要CSS + JS建议也将不胜感激.

html javascript css jquery contenteditable

56
推荐指数
4
解决办法
4万
查看次数

如何禁用浏览器或元素滚动条,但仍允许使用滚轮或箭头键滚动?

我想隐藏我的div元素和我的整个滚动条body,但仍然让用户使用鼠标滚轮或箭头键滚动.如何使用原始JavaScript或jQuery实现这一目标?有任何想法吗?

javascript css browser jquery scrollbar

52
推荐指数
5
解决办法
4万
查看次数

Twitter Bootstrap模式将html内容推向左侧

如果我打开一个模态对话框,通过Twitter Bootstrap,我注意到它将页面的所有html内容(即,在container)中向左推了一点,然后在关闭之后将其恢复正常.但是,这仅在浏览器宽度足够大而不能在"移动"(即最小)媒体查询上时才会发生.最新版本的FF和Chrome(未测试其他浏览器)会出现这种情况.

你可以在这里看到问题:http://jsfiddle.net/jxX6A/2/

注意:您必须增加"结果"窗口的宽度,以便切换到"med"或"large"媒体查询css.

我根据Bootstrap网站上显示的示例设置了页面的HTML:

<div class='container'>
    <div class='page-header'>
        <h4>My Heading</h4>
    </div>
    <div id='content'>
        This is some content.
    </div>
    <div class='footer'>
        <p>&copy; 2013, me</p>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我猜这不应该发生,但我不确定我做错了什么.

编辑:这是一个已知的错误,有关更多(和最新)的信息,请参阅:https://github.com/twbs/bootstrap/issues/9855

css jquery modal-dialog twitter-bootstrap bootstrap-modal

47
推荐指数
4
解决办法
4万
查看次数

允许滚动但隐藏滚动条

我有一个div像这样的元素样式:

 <div style="overflow-y: auto; max-height: 300px;">< id="DivTableContainer" ></div>
Run Code Online (Sandbox Code Playgroud)

当它变得高于300px时,我需要允许沿y轴滚动,这很好.但我需要设置"visiblity = false"滚动条本身.

我试着使用这个元素样式:

overflow-y: hidden;
Run Code Online (Sandbox Code Playgroud)

虽然它隐藏了滚动条,但它也不允许滚动.有没有办法滚动滚动条而不显示滚动条?

html javascript css

35
推荐指数
3
解决办法
11万
查看次数

隐藏Android中FlatList(React Native)中的滚动条

我想在我的应用程序中使用FlatList(React-native).我正在水平使用它,可以看到滚动条.ScrollView中有一个选项可以隐藏滚动条但不能隐藏在FlatList中.有没有人能够以其他方式隐藏它.我尝试使用父和子容器的解决方案(隐藏滚动条,但仍然能够滚动),但没有工作.

import React, { Component } from 'react';
import { Text, View, FlatList, StyleSheet, ScrollView } from 'react-native';
import { Card, Button } from 'react-native-elements';

const data = [
    { id: 1, title: 'title 1', details: 'details 1 details 1 details 1' },
    { id: 2, title: 'title 2', details: 'details 2 details 2 details 2 details 2 details 2 details 2' },
    { id: 3, title: 'title 3', details: 'details 3 details 3' },
    { id: 4, …
Run Code Online (Sandbox Code Playgroud)

react-native react-native-flatlist

34
推荐指数
5
解决办法
3万
查看次数

CSS隐藏滚动条,但元素可滚动

我有这个名为items的元素,元素内的元素长度超过元素高度,我想让它可滚动但隐藏滚动条,我该怎么做?

<div class="left-side">
    <div class="items" style="display:block;width: 94%;margin: 0 auto;overflow: hidden;">
    </div>
</div>

.left-side {
    width: 1470px;
    padding-top: 20px;
    height: 878px;
}
Run Code Online (Sandbox Code Playgroud)

我尝试将左侧类溢出设置为auto,但是没有做任何事情.

html css

25
推荐指数
5
解决办法
10万
查看次数