小编Har*_*rry的帖子

jQuery自动完成:如何刷新列表?

我有一个表单,其中包含可变数量的自动填充字段,这些字段使用相同的选择列表.根据需要添加和删除这些字段.每当页面上的参数发生变化时,我(尝试)通过首先调用unbind()然后autocomplete()添加到url的新参数来更新所有字段的列表.

$('input.foo').unbind().autocomplete(url?new_param=bar);
Run Code Online (Sandbox Code Playgroud)

问题是unbind()似乎没有解除绑定.当我输入输入字段时,它会触发自动完成事件的整个历史记录.

我也试过flushCache无济于事.

如何清除旧事件?

谢谢.

jquery binding jquery-autocomplete

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

CSS转换不适用于FF中的top属性

我有以下HTML:

<ul>
    <li>
        <a href="#">
            <h2>title</h2>
        </a>
    </li>
     <li>
        <a href="#">
            <h2>title</h2>
        </a>
    </li>
     <li>
        <a href="#">
            <h2>title</h2>
        </a>
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

CSS

ul {
    list-style: none;  
    text-align: center;
}
ul li {
    position: relative;
    float: right;
    margin-right: 20px;
    width: 30%;
}
ul li {
    transition: all 0.3s;
}
ul li:hover {
    top: -10px;
}
ul li> a{
    color: red;
}
Run Code Online (Sandbox Code Playgroud)

问题是转换不适用于moz,它适用于webkit.如何以跨浏览器的方式实现此功能?

DEMO

css firefox cross-browser css3 css-transitions

11
推荐指数
1
解决办法
9075
查看次数

在CSS中绘制有角度的线条

我正在尝试做的事情看起来很简单,但我似乎无法弄清楚如何去做.

正如您在我的图像中看到的那样,有几条红线穿过底部,然后向上弯曲靠近右侧.

在CSS中有一种方法可以绘制这样的线条吗?

示例显示行

css line css3 css-shapes

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

如何阻止<div>标签干扰计数器?

在下面的代码中,我需要使用divHTML顶部的标记进行样式设置.如果没有div标签,hx标签的轮廓编号正确,但是div一切都完全错误.我需要这个来工作,像这样,但随着div在地点标签还在,我需要它为不同ID的div的工作.有任何想法吗?

body {counter-reset: h1}
h1 {counter-reset: h2}
h2 {counter-reset: h3}

h1:before {counter-increment: h1; content: counter(h1) ". "}
h2:before {counter-increment: h2; content: counter(h1) "." counter(h2) ". "}
h3:before {counter-increment: h3; content: counter(h1) "." counter(h2) "." counter(h3) ". "}
Run Code Online (Sandbox Code Playgroud)
<div class="varies">
    <h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h1>
</div>
<p>Morbi efficitur nibh metus, a vehicula mauris tristique ac. Duis ornare metus eget iaculis hendrerit.</p>
  <h2>Morbi nisi lacus, …
Run Code Online (Sandbox Code Playgroud)

html css css-counter

11
推荐指数
2
解决办法
938
查看次数

在CSS3中重新创建三角形按钮形状

我正试图在CSS3中重新创建这个形状.

http://i.imgur.com/89qIwtf.png

这是我的解决方案:

<span><div id="shape"></div></span>
Run Code Online (Sandbox Code Playgroud)
span {
  display: block;
  margin-left: 88px;
}

#shape {
   width: 160px; 
   height: 100px; 
   background: #dcdcdc;
}

#shape:before {
   height: 76px;
   width: 76px;
   top: 20px;
   content:"";
   position: absolute; 
   border-radius: 10px;
   background-color: #ccc;
   left: 60px;
  -webkit-transform:rotate(45deg);

}

#shape:after {
   height: 76px;
   width: 76px;
   top: 20px;
   content:"";
   position: absolute; 
   border-radius: 10px;
   left: 220px;
   -webkit-transform:rotate(45deg);
   background-color: #ccc;
}
Run Code Online (Sandbox Code Playgroud)

不幸的是,这不能扩展:CodePen演示(我更改了背景颜色以说明我的方式).它垂直缩放很重要.

JavaScript解决方案也可以使用.

html css jquery css3 css-shapes

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

斜线的样式

我想在两个数字之间添加一个大斜线,以获得输出,如下图所示: 在此输入图像描述

我试图用来&#47;添加斜杠,但它做得不对(它显示在数字之后,而不是在数字之下).反正有没有让输出接近上面的图像?

<div class="box">
    <span class="top">41</span>
    <span class="line">&#47;</span>
     <span class="bottom">50</span>
</div>

.top {
    font-size: 100px;
    font-weight: bold;
}

.line {
    font-size: 100px
}
Run Code Online (Sandbox Code Playgroud)

JSFiddle: http ://jsfiddle.net/jxk8fvus/

html css css3 css-shapes

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

虚线顶部和底部边框比文字短

我想实现边框顶部和底部,如下图,我如何用CSS技巧实现?

图片

挑战是我不希望整个宽度与边界,它也应该响应.

移动版图像是http://i.imgur.com/XZTW28N.jpg,它也可以在桌面和移动浏览器中使用.

我尝试使用%宽度边框,但它不起作用.

我写下面的代码,但它不是100%完美的答案.

HTML:

<h1>How it Works</h1
Run Code Online (Sandbox Code Playgroud)

CSS:

h1:before, h1:after {
    content: "";
    height: 1px;
    background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(147,147,147,1) 50%,rgba(0,0,0,0) 100%);
    display: block;
    margin-bottom: 10px;
    margin-top: 10px;
}
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/wjhnX/488/

html css border css3 css-shapes

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

CSS折角效果透明背景

我有使用CSS折叠角的代码:

body {
  background-color: #e1e1e1
}
.note {
  position: relative;
  width: 480px;
  padding: 1em 1.5em;
  margin: 2em auto;
  color: #fff;
  background: #97C02F;
  overflow: hidden;
}
.note:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-width: 0 16px 16px 0;
  /* This trick side-steps a webkit bug */
  border-style: solid;
  border-color: #fff #fff #658E15 #658E15;
  /* A bit more verbose to work with .rounded too */
  background: #658E15;
  /* For when also applying a border-radius */
  display: block;
  width: 0; …
Run Code Online (Sandbox Code Playgroud)

html css jquery css3 css-shapes

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

在中间创建一个带圆的线

所以,我正在努力实现这个结果:

在中间的圆圈线

这是我尝试时得到的:https://jsfiddle.net/wvdkmjge/

.container {
  width: 100px;
  height: 1px;
  background-color: black;
}
.circle {
  display: inline-block;
  vertical-align: middle;
  width: 10px;
  height: 10px;
  background-color: transparent;
  border: solid 1px black;
  border-radius: 50%;
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">
  <div class="circle">

  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

而且,我希望我不会在圆圈上看到边界线.有什么建议?

html css html5 css3 css-shapes

10
推荐指数
3
解决办法
7631
查看次数

CSS三角形适合可变大小的div元素

请参考我的小提琴.我的目标是创建一个三角形(放在div中),并使其完全适合(角落到角落).

以下是规定的规则:

  • 将三角形放在所有div元素中.
  • 三角形的左下角应该适合所有div中的左下角.
  • 三角形的右上角应该适合所有div内的右上角.
  • div具有固定的宽度和高度但在现实生活中它们都是未知的,继承自父母.
  • 每个div的对角线角度都不同,但没关系.
  • 使用边框,渐变,变换或SVG来解决问题.我不想使用像canvas或PNG这样的固定像素解决方案.

.one {
  width: 100px;
  /* Unknown */
  height: 30px;
  /* Unknown */
  background: #ccc;
}
.two {
  width: 40px;
  /* Unknown */
  height: 90px;
  /* Unknown */
  background: #aaa;
}
.three {
  width: 70px;
  /* Unknown */
  height: 70px;
  /* Unknown */
  background: #aaa;
}
.triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 50px 50px;
  border-color: transparent transparent #007bff transparent;
}
Run Code Online (Sandbox Code Playgroud)
<div class="one"></div>
<br>
<div class="two"></div>
<br>
<div class="three"></div> …
Run Code Online (Sandbox Code Playgroud)

html css svg css3 css-shapes

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