小编dev*_*odo的帖子

我一直在努力解决问题几天没有成功所以决定在这里报名,看看是否有某种善良的人可以帮助我.手指交叉!

我正在尝试动画(淡入/淡出)无序列表中的链接的css背景颜色,当它悬停在上面时.保持无序列表结构是至关重要的,所以我不是在寻找一种解决方案,将每个链接分成它自己的div并激活它的背景颜色.

我还想限制解决方案来动画css而不是整个解决方案在js中,以便在js关闭时它简单而优雅地降级.

我有一个简单的无序导航列表,如下所示:

<div id="projectContent">
    <ul class="listings">
        <li><a href="*">Another Project</a></li>
        <li><a href="*">Year</a></li>
        <li><a href="*">Location</a></li>
        <li><a href="*">Country</a></li>
        <li><a href="*">Area</a></li>
    </ul>
</div>

这是我的css:

#projectContent .listings{display:block; width:780px; border-top:1px solid #008BFD;     margin:0; padding:0; float:left}
#projectContent .listings li{list-style:none; padding:0; line-height:1.6em}
#projectContent .listings li a{display:block; width:780px; color:#969991; text-decoration:none; border-bottom:1px solid #666; float:left; padding:0 0 1px 0;background-color:#F5F5F5; }
#projectContent .listings a:hover{background-color:#008BFD; color:#fff;}

到目前为止一直很好 - 但是我已经搜索了一个教程/插件的高低,这将允许我快速(比如50-100毫秒)淡化背景颜色当链接悬停并缓慢淡出(比如说500 -1000ms)当光标离开链接时.

我发现许多教程在链接上淡出背景图像,但几乎所有教程都涉及每个链接都在它自己的div或span中,我不想这样做......

我发现了一些我认为接近我正在寻找的教程但不幸的是他们没有提供演示这么难以确定...我明白我需要使用主要的jQuery脚本和jQuery颜色插件或核心用户界面 - 我试过两个都没有成功.

以下是我尝试过的一些jQuery示例:

var originalBG = $("#projectContent .listings li a").css("background-color");
var fadeColor = "#008BFD"; 

$("#projectContent .listings li a").hover( …

我有一个带有以下css的DIV

.divTab
{
    width: 700px;
    height: 550px;
    overflow:scroll;
    font-size: small;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    word-wrap: break-word;
}

和以下的HTML

  <div id="fragment-1">
        <div class="divTab">
            <pre>'.$my_name.'</pre>
            <pre>'.$my_servings.'</pre>
            <pre>'.$my_clients.'<pre>
            <pre>'.$my_description.'<pre>
        </div>
   </div>

所以现在我的问题是,文本被$my_description溢出宽度并在底部添加一个滚动,我不希望它溢出它的宽度,而是如果它达到divs宽度则进入下一行.我怎样才能做到这一点？

谢谢