小编Nat*_*teW的帖子

我有一个背景图像的div,我想扩展100%宽度并自动缩放div以适应图像所需的高度.目前它没有缩放div高度,除非我将div的高度设置为100%但是它只是伸展到屏幕的整个高度,而我希望它缩放到图像的高度.

这是html:

<div id="mainHeaderWrapper">


</div><!--end mainHeaderWrapper-->
<br class="clear" />;

这是css:

    #mainHeaderWrapper{


     background: url(http://localhost/site/gallery/bg1.jpg);
     width: 100%;
     height: auto;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover; 
     background-size: 100% 100%;

     background-repeat: no-repeat;
     background-position: center center; 

 }

 .clear { clear: both; }

感谢您的帮助

我希望能够在我的WooCommerce结帐字段中添加自定义CSS类.我正在使用twitter Bootstrap,我希望能够使用他们的.form-control类.

我查看了woocommerce模板文件夹,form-billing.php但我不确定将.form-control类添加到每个文本字段的位置.

这是代码 form-billing.php

<?php
/**
 * Checkout billing information form
 *
 * @author      WooThemes
 * @package     WooCommerce/Templates
 * @version     2.1.2
 */

 if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
 ?>
 <div class="woocommerce-billing-fields">
<?php if ( WC()->cart->ship_to_billing_address_only() && WC()->cart->needs_shipping() ) : ?>

    <h3><?php _e( 'Billing &amp; Shipping', 'woocommerce' ); ?></h3>

<?php else : ?>

    <h3><?php _e( 'Billing Details', 'woocommerce' ); ?></h3>

<?php endif; ?>

<?php do_action( 'woocommerce_before_checkout_billing_form', $checkout ); ?> …

我似乎无法获得嵌套属性来保存到数据库.我正在使用Rails 4.

这是我的模特:

class Answer < ActiveRecord::Base
  belongs_to :question
end


class Question < ActiveRecord::Base
  has_many :answers
  belongs_to :survey
  accepts_nested_attributes_for :answers, allow_destroy: true
end

class Survey < ActiveRecord::Base
  has_many :questions
  validates_presence_of :name
  accepts_nested_attributes_for :questions
end

这是控制器:

def create

  @survey = Survey.new(survey_params)

  respond_to do |format|
    if @survey.save
      format.html { redirect_to @survey, notice: 'Survey was successfully created.' }
      format.json { render action: 'show', status: :created, location: @survey }
    else
      format.html { render action: 'new' }
      format.json { render json: @survey.errors, status: :unprocessable_entity } …

我需要在Slick-slider中有一个jQuery UI可拖动元素.我知道jQuery UI有句柄选项http://jqueryui.com/draggable/#handle但是我不知道如何将它应用于光滑滑块.

我发现了这个问题:jQuery UI Slider干扰与光滑的轮播,但它使用jQuery UI的slider选项.当我在我的例子中做了类似的事情时,我能够禁用光滑滑块拖动...但是我的可拖动元素仍然无法拖动.

JSfiddle:http://jsfiddle.net/NateW/u1burczm/

如果仅在其中一个draggable元素内部仍然具有draggable可拖动的元素时,如何禁用光滑滑块上的拖动？

HTML:

<div class="wrapper-slider">
  <div> 
    <div id="draggable" class="ui-widget-content">
      <p>Drag me around</p>
    </div>
    <div id="draggable" class="ui-widget-content">
      <p>and me!</p>
    </div>
  </div>
  <div><h3>1</h3><h3>1</h3><h3>1</h3></div>
  <div><h3>2</h3><h3>2</h3><h3>2</h3><h3>2</h3></div>
  <div><h3>3</h3><h3>3</h3></div>
</div>

JS:

$('.wrapper-slider').slick({
  dots: false,
  infinite: false,
  centerPadding: "20px",
  speed: 300,
  slidesToShow: 1,
  adaptiveHeight: true
});

$(function() {
    $( ".draggable-element" ).draggable();
  });

$(".draggable-element").on("draggable mouseenter mousedown",function(event){
    event.stopPropagation();
});

我需要创建一个css背景颜色列表逐渐变暗以达到目标黑暗.我知道可以使用这里陈述的技术:Sass:用@for循环改变颜色 但是我想要从一种颜色调制到另一种颜色.不只是让颜色更暗更暗.

我有一个可变数量的项目,并希望背景颜色从白色移动到黑色.基本上是一个阶梯式渐变,定义了开始和结束颜色.

所以,如果我有三个项目,我希望输出是这样的:

.class1 {
  background-color: #fff;
}
.class2 {
  background-color: #808080; // 50% brightness
}
.class3 {
  background-color: #000;
}

如果我有五个项目,它看起来像这样:

.class1 {
  background-color: #fff;
}
.class2 {
  background-color: #bfbfbf; // 75% brightness
}
.class3 {
  background-color: #808080; // 50% brightness
}
.class4 {
  background-color: #404040; // 25% brightness
}
.class5 {
  background-color: #000;
}

开始和结束颜色应始终相同,但中间颜色需要根据循环中的项目总数自动调整.

我不知道Sass是否可以做到这样的事情？

如何从猫头鹰轮播中的导航按钮中删除上一个和下一个样式。

这是显示我正在谈论的内容的图片：

http://lookpic.com/O/t2/1725/N7d763L6.png

http://oi58.tinypic.com/2vnncl0.jpg

这是我的按钮样式

.owl-next{    display: block;
    width: 42px;
    height: 51px;
    background: url('../images/sp.png');
    background-position: -47px -19px;}
.owl-prev {
    display: block;
    width: 42px;
    height: 51px;
    background: url('../images/sp.png');
    background-position: 1px -19px;
}

您好我正在制作一个按钮,由于某种原因,当我点击它时,我没有打开Projects.php,我无法找到它为什么不起作用这里是我的代码:

<h1>Projects</h1>

<p> Some text</p>

<button type="button" class="btn btn-default" href="Projects.php">View details »</button>

我链接了以下库:

<link href="css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

我从引导站点下载引导程序文件并将文件夹放在我的目录中.我的文件保存为index.php(因为php代码是我的文件)

任何帮助表示赞赏!

我正在尝试使用jQuery编写一个简单的方法来检查和取消选中表单复选框.我已经尝试了stackoverflow中的一些示例,但是我有限的JS知识让我无法获得结果.

这是我的代码,并没有按照我的意图将输入复选框更改为"已选中",我还包含一个清除选择的按钮,但JS仍然没有引用它.

HTML:

<section id="opzioni">

<div class="bottoni-toggle">
    <!-- toggle button -->
    <input id="#select-all" type="button" value="Tutti" title="Toggle">
    <!-- clear button -->
    <input id="#select-none" type="button" value="Nessuno" title="Clear">
</div>

                <div class="col_opt">
                    <span class="custom_chb_wrapper">
                        <span class="custom_chb">
                            <input class="bottone-opzioni" id="_4wd" name="_4wd" type="checkbox">
                            <input id="_4wd" name="_4wd" type="hidden" value="0">
                        </span>
                        <label>4WD</label>
                    </span>
                </div>

                <div class="col_opt">
                    <span class="custom_chb_wrapper">
                        <span class="custom_chb">
                            <input class="bottone-opzioni" id="_airbag" name="_airbag" type="checkbox">
                            <input id="_airbag" name="_airbag" type="hidden" value="0">
                        </span>
                        <label>Airbag</label>
                    </span>
                </div>

jQuery的:

$(document).ready(function() {
    $("#select-all").click(function() {
        var checkBoxes = $("input.bottone-opzioni");
        checkBoxes.prop("checked", !checkBoxes.prop("checked"));
    });
});

这是我设置测试的 …

我在另一个div中有一个div需要与底部对齐并居中,当我尝试使其响应时问题变得更糟,如果它有帮助我有引导程序.

请使用小提琴作为参考:

http://jsfiddle.net/bqc2ztf2/

小提琴代码:

<div class="parent">
    <div class="sibling">
    </div>
</div>

.parent{
    width: 800px;
    height:400px;
    background-color:red;
}
.sibling{
    width:300px;
    height:50px;
    background-color: green;
}

编辑:忘了说我不能使用,position:absolute;因为它打破了我的设计.

我试图从数组的内容中删除所有空格.

这是我的阵列

var array = ["option 1", "option 2", "option 3"]

我尝试使用这里找到的答案:如何在使用jQuery抓取文本时剥离空格？

这就是我正在尝试使用的jQuery.

$(array1).each(function(entry) {
  $(this).replace(/\s+/g, '');
  console.log(entry);
});

但它抛出了一个 TypeError: undefined is not a function (evaluating 'entry.replace(/\s+/g, '')')

我错过了什么？

我有一个ul列表,并希望隐藏所有不在锚内的文本.这是来自CMS的标记,因此我无法添加其他选择器...

<ul class="list">
  <li class="sub">
    <a href="#">link</a> not linked
  </li>
</ul>

我尝试使用以下css但它不起作用.

.list .sub:not(a) {
  display: none;
}

为什么这不起作用？

Jsfiddle:http://jsfiddle.net/9tg0g44e/