小编Pra*_*man的帖子

CSS3 - 不同HTML元素之间的混合模式

我很清楚答案是什么,但我只想绝对肯定.

我有两个元素,div.glassdiv.sound,都包含一个背景图像.是否可以将混合模式设置为每个div,以便它们相互交互?例如:

div.glass,
div.sound {
  width: 597px;
  height: 154px;
  position: absolute;
}
div.glass {
  background: url(glass.png) 0 0 no-repeat;
  z-index: 9;
  top: 5px;
  left: 5px;
}
div.sound {
  background: url(soundwave.png) 0 0 no-repeat;
  z-index: 10;
  blend-mode: multiply;
  top: 50px;
  left: 300px;
}
div.container {
  position: relative;
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">
  <div class="glass"></div>
  <div class="sound"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

html css html5 blending css3

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

Bootstrap 模式 - 屏幕变黑

我有两个模态,它们会在单击按钮时弹出。一个工作正常,但是对于第二个,屏幕变黑,没有任何反应:

一、工作模态:

<div id="deleteConfirmation" class="hidden, modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <h5>Are you sure you want to delete this contact?</h5>
      <button id="deleteOk">
        Yes
      </button>
      <button id="deleteNo">
        No
      </button>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

并弹出此命令:

$('#deleteConfirmation').modal('show');
Run Code Online (Sandbox Code Playgroud)

第二个,几乎相同,但不起作用:

<div id="addContact" class="hidden, modal fade">
  <div class="modal-header">
    <h5>Add New Contact</h5>
  </div>
  <div class="modal-dialog">
    <div class="modal-content"> 
      <label>First Name </label><input /> <br />
      <label>Last Name </label><input /> <br />
      <label>Address </label><input /> <br />
      <label>Phone Number </label><input /> <br />

      <button id="addConfirm">
        Confirm
      </button>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

和命令: …

javascript jquery modal-dialog twitter-bootstrap

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

每 10 秒在 FOR 内部运行一个函数

我的脚本中有这个:

for(var i = 0, l = eachLine.length; i < l; i++) {
 if(eachLine[i].length>0){
  doP(eachLine[i], +i);
 }
}
Run Code Online (Sandbox Code Playgroud)

for 从字符串中读取行并调用 doP 函数。发生的情况是它太快了,并根据文本大小在我的网页上造成了一些速度问题。

我想要的是每 10 秒调用一次 doP 函数......换句话说,我想等待 10 秒再次调用 doP 函数......我怎样才能让它工作?

jquery

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

如果 URL“只有一行 HTML”,jQuery.load() 怎么可以跨域工作?

在我的网站上,我正在尝试编写一个 JavaScript 脚本,该脚本在单击按钮时从某些网站的 HTML 源中抓取数据并在我的网站上显示解析/清理的数据。

在阅读TutorialsPoint 的 JQuery - Ajax 页面后,它展示了 jQuery.load() 方法,

<script type = "text/javascript" language = "javascript">
     $(document).ready(function() {
        $("#driver").click(function(event){
           $('#stage').load('/jquery/result.html');
        });
     });
</script>
Run Code Online (Sandbox Code Playgroud)

我决定在我的网站上尝试一下。我将 URL 从相对 URL 更改为绝对 URL——“ http://www.tutorialspoint.com/jquery/result.html ”——令我惊讶的是,它实际上正在运行(单击EXTRACT DATA)。这与我的理解相矛盾,在阅读了数十个 SO 线程以及 jQuery.load() API 后,HTTP 请求将受制于同源策略。

由于浏览器安全限制,大多数“Ajax”请求都遵循同源策略;请求无法从不同的域、子域、端口或协议成功检索数据。~ API

当我将 URL 更改为http://google.com/http://www.example.com/之类的内容时,脚本不起作用。

前面提到的教程页面上的一行引起了我的注意:

这里 load() 向指定的 URL /jquery/result.html 文件发起 Ajax 请求。加载此文件后,所有内容都将填充在带有 ID stage 标记的内部。假设,我们的 /jquery/result.html 文件只有一行 HTML

如果指定 URL 处的 HTML 文件只有一行,那么 load() 如何跨域工作?

html javascript ajax jquery

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

如何在zend框架控制器中包含文件?

你好我是zend框架中的新手..

我想知道如何在zend框架控制器中包含文件

我在zend框架控制器中使用这样的动作

public function anyAction()
{
   require("../mailchimp/anyfile.php");
}
Run Code Online (Sandbox Code Playgroud)

我可以做什么来包含这些文件,意味着保存所有这些文件的正确位置

php zend-framework

4
推荐指数
1
解决办法
7340
查看次数

CSS - 缩小除第一行以外的所有内容

更新2013-01-04

  • flexbox解决方案使得额外的HTML/CSS变得非常少.然而,目前还不清楚它是否可以在Firefox和IE10中运行?
  • :before使用CSS内容而不是HTML 添加减号字符是一种更好的方法.

信息

我有一张包含一些内容的表格.根据深度,我在文本前面有一些减号.

问题/疑问

我无法弄清楚如何使文本右对齐和减号字符左对齐,即使在换行时也是如此.减号和文本长度可以变化.

关于jsfiddle的例子

如果你愿意,可以编辑它......

http://jsfiddle.net/Rjvc9/

如果jsfiddle不起作用的HTML

<table>
    <td>            
        <span class="lines">----</span> <span class="text">My page that is far too long for it to fit on one row</span>
    </td>
</table>

<br>

This is how it should work.<br><br>

<table>
    <td>            
        <span class="lines">----</span> <span class="text">My page that is far<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;too long for it to fit<br>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;on one row</span>
    </td>
</table>?
Run Code Online (Sandbox Code Playgroud)

CSS如果jsfiddle不起作用

table {
    background: #eee;
    width: 150px;
}

td {
    font-family: Arial;
    font-size: 14px;
    line-height: 18px;
    margin: 40px; …
Run Code Online (Sandbox Code Playgroud)

css indentation line-breaks content-length twitter-bootstrap

4
推荐指数
2
解决办法
5548
查看次数

Twitter Bootstrap Popover和AJAX

我一直在浏览如何在bootstrap popover上加载ajax内容的解决方案,但找不到任何合适的解决方案.

这是我到目前为止所拥有的:

$(".btnCharge").click(function () {
    $("#boxPayment").fadeIn();
})
.popover({
    title: 'Advantages',
    html: 'true',
    content: function () {
        $.ajax({
            type: "POST",
            url: "Index.aspx/FindAdvantagesByCCID",
            data: '{"id": "' + 1 + '"}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                var json = jQuery.parseJSON(data.d);
                var html = '';
                $.each(json, function (i, item) {
                    html = html + '<a href="#"><i class="icon-ok"></i>' + item.Advantage + '</a><br />';
                });
            }
        });
    },
    placement: 'bottom',
    trigger: 'hover'
});
Run Code Online (Sandbox Code Playgroud)

如何在弹出窗口内容中添加ajax响应?我试过"返回"并且不起作用.

有清洁的解决方案

javascript asp.net ajax popover twitter-bootstrap

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

如何重置NoUiSlider?

如何使用 javascript 重置特定形式的所有滑块?(jquery也可以)http://refreshless.com/nouislider/

javascript jquery reset nouislider

4
推荐指数
1
解决办法
9286
查看次数

树状结构为嵌套的ul li

我从订单列表下面做了一个树状的结构.输出看起来像这样

在此输入图像描述

问题是图像中的红色圆圈.所以如果我没有任何进一步的水平但是显示出来,我不想显示那条线.我无法解决这个问题.

显示线条的css如下

li::before {
    content: '';
    position: absolute;
    height: 1px;
    background: #666;
    top: 11px;
    width: 30px;
    left: -17px;
}

ul.child::before {
    content: '';
    position: absolute;
    width: 1px;
    background: #666;
    top: -9px;
    bottom: 10px;
    left: -14px;
}
Run Code Online (Sandbox Code Playgroud)

我的html结构如下

<ul class="tree">
<li id="" class="has-children showChildren">
    <i class="fi-minus"></i>

    <div class="checkBoxDesign">
        <input type="checkbox" name="massTypeId" class="massTypeTreeId" id="t_8587509197182534205xy9w" value="8587509197182534205xy9w">
        <label for="t_8587509197182534205xy9w"></label>
    </div>
    <span class="text">Sand</span>
    <ul class="child">
        <li id="8587509198220874655a1s8" class="has-children showChildren">
            <i class="fi-minus"></i>
            <div class="checkBoxDesign">
                <input type="checkbox" name="massTypeId" class="massTypeTreeId" id="t_8587509198220874655a1s8" value="8587509198220874655a1s8">
                <label for="t_8587509198220874655a1s8"></label>
            </div>
            <span class="text">Fyllgrus</span> …
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap

4
推荐指数
2
解决办法
7558
查看次数

黑色不透明度叠加使图像尺寸增大

我有一个小问题,真的很烦我.每当我的图像悬停在上面时,会出现带有不透明度的黑色叠加层.但是,它会使图像高度增长.请注意,我不是指变换,规模属性.实际图像在图像底部的高度增长.

是什么造成的?

$('.home-img-block').find('img').each(function() {
  var imgClass = (this.width / this.height > 1) ? 'wide' : 'tall';
  console.log(imgClass);
  $(this).addClass(imgClass);
});
Run Code Online (Sandbox Code Playgroud)
#home-img-block-section {
  width: 100%;
  height: 900px;
}
#home-img-blocks {
  width: 100%;
  height: 450px;
}
.home-img-block {
  width: 33.33%;
  /*height: 100%;*/
  float: left;
  display: inline-block;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.home-img-block:hover .overlay {
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.home-img-block:after {
  content: attr(data-content);
  color: #fff;
  position: absolute;
  top: 50%;
  left: …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery image

4
推荐指数
1
解决办法
123
查看次数