Question

我知道这可能很容易，但我准备好把我的笔记本电脑扔出窗外......

我一直在尝试在我的一个网页中进行一些javascript工作，但是如果没有这个，我备份了我之前的代码，并尝试恢复以前的代码......但它完全搞砸了我的画廊页面（我没有碰过这个页面）并且它没有与我的CSS连接 - 我真的不明白它。

画廊中的图像应该是水平的而不是垂直的。

请帮助，我是Wordpress的新手并且理解我的编码可能是业余的

/*

主题名称：tigertone 主题URI：http://tigertonestudio.com 描述：版本：1.0 * /

#clear {
clear: both;
}

body {
margin:0;
padding:0;
height: 100%;
background: url('images/bg.png') repeat;
text-align:left;
font-family: "Verdana", Arial, Helvetica, sans-serif;
font-size:.8em;
}

#brushblack {
background: url('images/brushblack.png') repeat;
height: 100%;
}

#header{
width:1000px;
height:118px;
margin: 0 auto;
padding:50px 0 25px 0;
clear: both;
}

#content {
font-family:'aller', Arial, Helvetica, sans-serif;  
margin:0 auto;
width:100%;
padding:0;
text-align:left;
vertical-align: middle; 
}

.blackcontent {
background: url('images/bgdark.png') repeat;
width:100%;
padding:40px 0;
height:100%;
overflow:hidden;
margin:0 auto;
vertical-align: middle;
}

.content{
margin:0 auto; 
width:1000px;
}

.entry {
color:#000000;
}




.ngg-albumoverview .ngg-album-compact { float: left; margin-right: 20px;}


.ngg-gallery{
width:100%;
float: left;
}

.ngg-gallery-thumbnail-box {
width: 25% !important;
float: left;
margin-bottom:10px;
border:5px
border-color:white;
}


===================
Classes Page
===================

.classes {
margin-bottom: 75px;
}

.classes {
width: 450px;
float: left;
margin: 10px 8px 0 0;
}

.classes:nth-child(4n+4) {
margin-right: 0;
}

.classes a {
text-decoration: none;
}

.classes h2,
.classes .classes-bio h2 {
font-weight: 700;
font-size: 1.5em;
text-transform: none;
margin: 15px 0 5px 12px;
}

.classes .classes-bio p {
color: #666;
line-height: 21px;
margin: 0 70px 18px 70px;
}

.classes .classes-bio p strong {
font-weight: 700;
}


.classes a.read-more {
color: #D1883E;
display: block;
margin: 12px 0 0 0px;
}

.classes a.read-more:hover {
text-decoration: underline;
}

.classes .classes-bio {
position: fixed;
width: 600px;
height: 90%;
display: none;
z-index: 9998;
padding-bottom: 10px;
background-color: #eaeaea;
}

.classes .classes-bio .close-button {
position: absolute;
top: -17px;
right: -17px;
z-index: 9999;
cursor: pointer;
}

.classes .classes-bio img.profile {
width: 442px;
margin: 25px 181px 8px;
}

.classes .classes-bio h2 {
text-align: center;
margin-bottom: 6px;
}

.classes .classes-bio {
font-size: 1.1em;
margin-bottom: 28px;
}

.classes .classes-bio p {
font-size: 0.9em;
color: #000;
text-align: center;
}


.mask {
position: absolute;
left: 0;
top: 0;
display: none;
z-index: 9997;
background-color: #000;
}

HTML：

<h1>Gallery</h1>
<div class="ngg-gallery">
<div class="ngg-galleryoverview">
<div class="ngg-gallery-thumbnail-box">
[nggallery id=1]
</div>
</div>
</p>
</div>

Answer 1

style.css的第396行缺少}，可能会导致您的问题。

那里也有一些未评论的评论......

===================
Classes Page
===================

（和其他人一样）应该是这样的

/*
===================
Classes Page
===================*/

Answer 2

styles.css文件中有一部分列出如下：

a:link{
    font-color:#000;
a:hover{
    color:#D1883E}

看起来你在第一个a：链接样式块之后缺少一个右括号。

Answer 3

看起来你的global.js文件存在问题。 Wordpress附带的jQuery库处于无冲突模式，这意味着您无法使用$符号。解决方案是用代码包围代码 jQuery(document).ready(function ($) {

因此，在您的情况下，将global.js文件更改为：

jQuery(document).ready(function ($) {    
     $('.classes a').click(function(e) {    
         e.preventDefault();

    // Get the dimensions of the user's screen
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    // Set the mask overlay to fill the entire screen
    $('.mask').css({'width':maskWidth,'height':maskHeight});

    // Fade in the mask overlay
    $('.mask').fadeTo(600, 0.7);

    // Get the dimensions of the user's browser
    var winHeight = $(window).height();
    var winWidth = $(window).width();

    // Set the bio pop-up to be in the middle of the screen
    $('.classes-bio').css('top', winHeight/2-$('.classes-bio').height()/2);
    $('.classes-bio').css('left', winWidth/2-$('.classes-bio').width()/2);

    // Fade in the bio pop-up
    $(this).parent('.classes').find('.classes-bio').delay(610).fadeIn(600);
});

// Click the mask or close button to fade out the pop-up and the mask
$('.mask, img.close-button').click(function(e) {

    $('.classes-bio').fadeOut(600);

    $('.mask').delay(610).fadeOut(600);
});

});

查看更多here

我不知道它是否会解决您的问题，但您可以尝试一下！

Css没有被阅读WP

3 个答案: