0

我正在使用http://keith-wood.name/imageCube.html的 jquery 插件。

它是这样工作的，但是......

当我的页面加载列表中的第一个图像（AT_logo.png）时，它显示在我放置的正确位置，但是当 .imagecube 启动时它会移动。我注意到在它放入的 CSS 中，它的位置是绝对的，但我的图像在我的班级中浮动到左侧。

然后添加的“imagecubeshading”类最后不在图像之间，因此它像图像一样滚动浏览它们。

我的代码在底部。如果需要更多信息，请询问。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="Scripts/imagecube.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function () {
$('#logocube').imagecube();});
</script>

<div class="title_container">
    <div class="title_content1">
        <div class="title">title</div>
        <div class="sub_text">
            <a href="">Linked in</a>
            <b>Email</b>infp@email.com
        </div>
    </div>

    <div class="logo" id="logocube">
        <img src="images/AT_logo.png" title="logo"/>
        <img src="images/AT_logo_bl_gr.png" title="logo"/>
        <img src="images/AT_logo_bl_wh.png" title="logo"/>
        <img src="images/AT_logo_gr_wh.png" title="logo"/>
        <img src="images/AT_logo_wh_bl.png" title="logo"/>
        <img src="images/AT_logo_wh_gr.png" title="logo"/>
   </div>

    <div class="title_content2">
        <div class="title" style="float:right;;">title</div>
        <div class="sub_text" style="float:right;">sub text</div>
    </div>
</div>

和CSS

.title_container
{
width:1265px;
height:380px;
margin-left:auto;
margin-right:auto;
position:relative;
background-color:transparent;
}

.title_content1
{
 width: 505px;
 height: 330px;
float: left;
background-image: url(/images/title_content_left.png);
background-repeat: no-repeat;
margin: 10px;
margin-top: 20px;
z-index:1;
}

.logo
{
width: 214px;
height: 198px;
float: left; 
margin-top: 40px;
margin-left: 162px;
margin-bottom: 72px;
z-index: 2;
position: absolute;
}

#logocube
{
width:214px;
height:198px;
}   

.title_content2
{
width: 505px; 
height: 330px;
float: right; 
background-image: url(/images/title_content_right.png);
background-repeat: no-repeat;
margin: 10px;
margin-top: 20px;
z-index:1;
}
4

0 回答 0