小编Bri*_*and的帖子

自定义复选框在Firefox上失败

我正在尝试使用CSS3制作自定义复选框,这在Chrome上运行良好.在Firefox上......不是那么多.

编辑:它似乎在Firefox 37上正常工作.

以下答案仍然相关,但2013年中期的风格相关问题已得到解决.

这里没有提到IE支持,但欢迎对其进行编辑/回答.

演示

HTML:

<input type="checkbox" id="first"/>
<label for="first">This is pretty awesome</label>
Run Code Online (Sandbox Code Playgroud)

CSS:

input[type=checkbox] {
  appearance: none;
  background: transparent;
  position: relative;
}
input[type=checkbox]::after {
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  text-align: center;
  background: #aaa;
  display: block;
  pointer-events: none;
  opacity: 1;
  color: black;
  border: 3px solid black;
}
input[type=checkbox] + label {
  line-height: 48px;
  margin: 0 15px 0 15px;
}
input[type=checkbox]:hover::after {
  content: '';
  background: #32cd32;
  opacity: .3;
}
input[type=checkbox]:checked::after {
  content: '\2713';
  background: #32cd32;
} …
Run Code Online (Sandbox Code Playgroud)

checkbox firefox css3

13
推荐指数
2
解决办法
1万
查看次数

使用JavaScript访问框架的文档对象

我在这个页面上测试,我不确定我缺少什么.

// Two frames on the page
> document.getElementsByTagName("frame").length
2

// Same domain, so no security restrictions
> document.getElementsByTagName("frame")[0].src
"http://www.quackit.com/html/templates/frames/menu_1.html"
> window.location.href
"http://www.quackit.com/html/templates/frames/frames_example_1.html"

// Can't access the document
> document.getElementsByTagName("frame")[0].document
undefined
Run Code Online (Sandbox Code Playgroud)

看起来这应该有效,所以问题是什么?它需要在IE8中工作,但我也在Chrome中测试(最新的稳定版).

html javascript dom frame

12
推荐指数
1
解决办法
5万
查看次数

是否可以在浏览器中运行pygame或pyglet?

我的PC上安装了3个游戏库:pyglet,pygame和Panda3D.

我想创建一个2D游戏,并使其成为一个网络浏览器游戏,所以我可以把它放在Facebook上.

我知道Panda3D有一个网络浏览器插件.Panda3D的是3D游戏为主.

因此,我问,是否可以在浏览器中播放pygletpygame游戏?如果没有,你推荐什么Python库?

python pygame pyglet activepython python-2.7

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

当z-index不工作时如何强制元素到顶部?

我正在编写一个chrome扩展,它使用注入来修改目标网页中的元素.我想在光标移动元素时显示消息气泡.但我遇到一个问题,有时消息泡沫被其他一些元素隐藏.我发现这是因为如果元素B位于元素A的顶部,则z-index将不起作用,元素A的子元素(消息气泡)永远不会高于元素B.

为了演示它,这是一个例子.尽管obj2的z-index是1000000,obj2总是会被obj3隐藏.

有什么解决方案吗?

.aaa{
    background-color:blue;
    width:100px;
    height:100px;
}
.ccc{
    background-color:red;
    width:80px;
    height:80px;
    z-index:1000000;
}
.bbb{
    background-color:green;
    position:relative;
    top:-50px;
    left:50px;
    width:100px;
    height:100px;
}
Run Code Online (Sandbox Code Playgroud)
<div>
    <section id=obj1 class="aaa">
    <article id=obj2 class="ccc">
    </article>
    </section>
</div>
<section id=obj3 class="bbb">
</section>
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

css

10
推荐指数
1
解决办法
2万
查看次数

使用JSON字符串为jQuery加载Flexigrid

我试图通过使用WCF服务返回的JSON字符串来加载Flexigrid.

我的服务有一个public string GetContacts(string CustomerID)方法,它返回一个Json字符串.

通过使用System.Web.Script.Serialization.JavaScriptSerializer类从List对象创建JSON字符串 .所以,我的目标是将JSON字符串绑定到我的Flexigrid作为对象.我使用Web服务结果转换为对象

var customer = eval("("+result+")"); 
Run Code Online (Sandbox Code Playgroud)

结果是从服务返回JSON字符串.有没有办法将客户对象绑定到Flexigrid?

javascript json

9
推荐指数
1
解决办法
3万
查看次数

安装APC时"找不到可接受的C编译器"

我需要做些什么才能使APC正常工作,似乎我没有在正确的地方或类似的地方使用交流编译器?一旦安装,我如何验证它是否正确运行?

[root@ec2-user]# pecl install apc
downloading APC-3.1.9.tgz ...
Starting to download APC-3.1.9.tgz (155,540 bytes)
.................................done: 155,540 bytes
54 source files, building
running: phpize
Configuring for:
PHP Api Version:         20090626
Zend Module Api No:      20090626
Zend Extension Api No:   220090626
config.m4:180: warning: AC_CACHE_VAL(PHP_APC_GCC_ATOMICS, ...): suspicious cache-id,                     must contain _cv_ to be cached
../../lib/autoconf/general.m4:1974: AC_CACHE_VAL is expanded from...
../../lib/autoconf/general.m4:1994: AC_CACHE_CHECK is expanded from...
config.m4:180: the top level
config.m4:180: warning: AC_CACHE_VAL(PHP_APC_GCC_ATOMICS, ...): suspicious cache-id,     must contain _cv_ to be cached
../../lib/autoconf/general.m4:1974: AC_CACHE_VAL is …
Run Code Online (Sandbox Code Playgroud)

php installation apc

9
推荐指数
2
解决办法
1万
查看次数

较大的div位于较小的div内

#containment在另一个div(#edit)里面有一个div().外部div较小.内部div的大小将由一些jQuery代码更改.

我想让内部div始终位于外部div的内部.

<div id="edit"><div id="containment"></div></div>

#edit {
    width:200px;
    height:200px;
    overflow:visible;
    margin-top:100px;
    background:gray;
}
#containment {
    width:500px;
    height:500px;
    opacity:0.5;
    background:red
}
Run Code Online (Sandbox Code Playgroud)

小提琴

我怎样才能做到这一点?

css

9
推荐指数
1
解决办法
9232
查看次数

如何在Sublime Text中为React JSX定义注释字符?

在OSX中,在Sublime Text 3(build 3065)中,语法设置为JavaScript(JSX)或只是JSX,我按常规 cmd+ /来注释掉所选文本.

但是,//当我想要包装选择时,ST3默认为评论字符:

{/* foobar selected text */}

我在这里看,但无法弄清楚要编辑的内容:

/Users/admin/Library/Application Support/Sublime Text 3/Packages/User/JavaScript (JSX).tmLanguage

提前致谢!:)

sublimetext sublimetext3 reactjs react-jsx

9
推荐指数
1
解决办法
3519
查看次数

无法使用resolve.alias进行JEST测试

我正在为我的应用程序使用WebPack + React + Jest,并且已经resolve.alias = { app: "/path/to/app" }在我的配置文件中进行了设置.

在React中,我可以使用此路径执行require("app/component")并正确获取"/path/to/app/component.js"中的文件.

运行JEST测试时,无法在测试中或在导入的模块中识别此别名.所有这些在运行应用程序时都有效,但不适用于使用jest-cli的测试.

javascript unit-testing reactjs webpack jestjs

9
推荐指数
1
解决办法
2249
查看次数

浏览器重新设置任务很慢

我正在使用Gulp作为我的任务运行器并使用浏览器来捆绑我的CommonJs模块.

我注意到运行我的browserify任务非常慢,大约需要2到3秒,我所拥有的只是React和我为开发构建的一些非常小的组件.

有没有办法加快任务,或者我的任务中是否有任何明显的问题?

gulp.task('browserify', function() {
  var bundler = browserify({
    entries: ['./main.js'], // Only need initial file
    transform: [reactify], // Convert JSX to javascript
    debug: true, cache: {}, packageCache: {}, fullPaths: true
  });

  var watcher  = watchify(bundler);

  return watcher
  .on('update', function () { // On update When any files updates
    var updateStart = Date.now();
        watcher.bundle()
        .pipe(source('bundle.js'))
        .pipe(gulp.dest('./'));
        console.log('Updated ', (Date.now() - updateStart) + 'ms');
  })
  .bundle() // Create initial bundle when starting the task 
  .pipe(source('bundle.js'))
  .pipe(gulp.dest('./'));
});
Run Code Online (Sandbox Code Playgroud)

我正在使用Browserify,Watchify,Reactify和Vinyl Source Stream以及其他一些不相关的模块. …

javascript browserify reactjs gulp watchify

9
推荐指数
1
解决办法
6128
查看次数