小编Bra*_*ell的帖子

我一直在制作一个程序,我想知道启动两个函数之间的区别如下:

$(function () {
   //content
});

和

function Name () {
    //content
}

另外,为什么我不能说出第一个例子？我尝试将第一个示例更改为第二个示例,并且该函数已完全停止工作.我在第一个例子中使用了jQuery,一切都很好,但是有一个不同的例子,函数停止工作.

那有什么区别？

有很多动态设计的网站,当浏览器大小减少时,div或图像会缩小.

这方面的一个例子是http://en.wikipedia.org/wiki/Main_Page

随着浏览器大小减小,文本缩小的div.这种情况一直持续到某一点,它只是决定停止收缩,并开始覆盖文本框.

我想用我正在研究的JSFiddle来做这个效果:http: //jsfiddle.net/MrLister/JwGuR/10/

如果你拉伸小提琴的大小,你会看到图片动态适应.目标是让它在某个时刻停止缩小,然后开始覆盖或放弃这些照片.我想这样做是因为它最终会变得很小,以至于每个图像上的文本重叠并且看起来很糟糕.

这是小提琴的CSS:

.figure {
    position: relative;
    display:inline-block;
    max-width: 33%;
}

.figure .figcaption {
    text-align: center;
    height:0;
    top: 40%;
    width: 100%;
    font-size: 55px;
    color: white;
    position: absolute;
    z-index: 1;
}

.figure img {
    display: block;
    max-width: 100%;
}

我有一个快速的网络程序,当你将鼠标悬停在另一个图像上时,下面会弹出一个小框.

我设置了一个像这样的快速函数:

$('.indArtistBox').hover(function(){
    $('.description').show();
});

这个问题是我想要一些如何合并this,因为我只希望描述显示在.indArtistBox正在徘徊.

我试过$(this).('.description'),但这显然不起作用.我怎么做到这一点？

出于某种原因,似乎我的div底部有一个额外的填充,其中包含一个图像.

这是JSFiddle:http://jsfiddle.net/KSs7V/

关于如何到达/如何修复它的任何想法？

CSS:

.artist-box {
    width: 100%;
    text-align: center;
    position: relative;
    display: inline-block;
}

.artist-pic {
    height: 245px;
    margin: 0;
    /*box-shadow: 0 0 10px black;*/
}
#artist-wrap {
    max-width: 1800px;
    margin-top: 5px;
}

.indArtistBox {
    display: inline-block;
    margin-right: 10px;
    position: relative;
    border: 1px solid #000;
}

这是jQuery:

$(document).ready(function() {
    $('#box').click(function() {
        $(this).addClass('fullColor');
    });
});

这是CSS:

#box {
    width:200px;
    height:200px;
    background-color:blue;
    opacity:0.5;
}

.fullColor {
    opacity:1.0;
}

JSFiddle:http://jsfiddle.net/VPW6c/