小编Hot*_*ava的帖子

onBlur() 无法正常工作

如果它们单击元素区域之外,我希望<div>with 类.shell-pop被关闭。但它似乎没有触发,也没有任何日志或警报发出。我环顾四周,一切看起来都对吗?

jQuery

$('document').ready(function () {
    updateCart();

    $(".shell").click(function (e) {
        e.preventDefault();
        $(".shell-pop").fadeIn(300, function () { $(this).focus(); });
    });

    $(".shell-pop").on('blur', function () {
        $(this).fadeOut(300);
        window.alert("work");
        console.log("works");
    });
});
Run Code Online (Sandbox Code Playgroud)

HTML

<div class="options-area">
    <div class="options-popup shell-pop">
        <div class="swatches">
            <div class="colors-shell colors" id="green">
                <p class="prices-for-swatch">$14.23</p>
            </div>
            <div class="colors-shell colors" id="pink">
                <p class="prices-for-swatch">$7.23</p>
            </div>
            <div class="colors-shell colors" id="blue">
                <p class="prices-for-swatch">$11.25</p>
            </div>
            <div class="colors-shell colors" id="orange">
                <p class="prices-for-swatch">$10.23</p>
            </div>
            <div class="colors-shell colors" id="default-shell">
                <p class="prices-for-swatch">FREE</p>
            </div>
            <div class="colors-shell colors" id="exit">
                <img src="img/Silhouette-x.png" …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery dom onblur

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

如何修复链接上的边框和填充

我正在尝试修改我正在编辑的页面上的链接行,我无法直接编辑HTML,并且只能编辑CSS.无论我做什么原因,链接的文本行都会溢出到其他行中.

结果应如下所示:

正确的样子

但我明白了:

在此输入图像描述

body {
    max-width:1122px;
    min-width:1122px;
}
.free_column{
    float:left;
    width:345px;
    height:315px;
    margin-right:10px;
    margin-left:12px;
    margin-top:20px;
    border:#d9d9d9 4px solid;

}
.free_column header{
    padding:14px;
}
.free_column h2{
    font-size:1.3em;
    color:#ffffff;
    font-family: 'Montserrat Subrayada', sans-serif;
    font-weight:200;
}
.free_column h3{
    font-size:.9em;
    color:#c3c2cc;
}
.free_column a{
    /*padding-left:64px;*/
    /*padding-right:150px;*/
    margin-top:20%;
    margin-left:18px;
    text-align:left;
    color:#667cbd;
    line-height:2.9em;
    border-top: #d1d1d1 2px dotted;
    padding-top:11px;
    font-size:1em;
}

.free_column header{
    background-color:#9f310e;

}
Run Code Online (Sandbox Code Playgroud)
<section class="free_column">
    <header>
        <h2>Free Enterprise</h2>
        <h3>Free Enterprise - Your Home for Free Market News and Ideas</h3>
    </header>
    <a class="free_links" href="#">Military, Government, Business: …
Run Code Online (Sandbox Code Playgroud)

html css padding

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

在多维数组中使用imgs

我正在尝试从多维数组加载图像,但我似乎无法显示图像.它们只显示为文本.

function cartoonsRndm(x) {
    var cartoon = new Array();
    cartoon[0] = {
        person: "Trixie",
        show: "my little pony",
        img: "img/trixie.jpg"
    };
    cartoon[1] = {
        person: "Sanic",
        show: "Sanic the hagehug",
        img: "img/sanic.png"
    };
    cartoon[2] = {
        person: "megaman",
        show: "blue bomber",
        img: "img/man.jpg"
    };
    var hero = cartoon[x]["person"] + " " + cartoon[x]["show"] + " " + cartoon[x][src = "img"]
    document.getElementById("answer").innerHTML = hero
}
Run Code Online (Sandbox Code Playgroud)

javascript arrays

0
推荐指数
1
解决办法
35
查看次数

标签 统计

html ×2

javascript ×2

arrays ×1

css ×1

dom ×1

jquery ×1

onblur ×1

padding ×1