Question

我制作了一个导航栏，当我缩小它时，它移动（最后消失）。我怎么能阻止这个？这是导航栏：http://tinkatips.hol.es/testmap.html

我已经尝试通过CSS定位它但它不起作用（并且代码也不起作用。）：http://www.w3schools.com/cssref/playit.asp?filename=playcss_position

如何修复它以便在缩小时不会移动？

这是导航栏和自动收报机的代码。（和图像映射）

<style type="text/css">

.topticker {
        background-repeat:no-repeat;
    background-position: top;
    height: 150px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:20px;
    color:#FFFFFF;


}

.realnewsbg {
        background-image: url(http://tinkatips.hol.es/Navbar.png);
width: 1000px;
height: 122px;
    float:left;
        margin-top:-130px;
    margin-left:120px;
    text-align:center;
z-index: -1;
}


.realnews {
background-image: url(http://deltaflow.com/themes/deltaflow/images/pixel_transparent.gif);
width: 1000px;
height: 122px;
    float:left;
        margin-top:-40px;
    margin-left:220px;
    text-align:left;
z-index: -1;

}


</style>

<style type="text/css">

#ajaxticker1{
width: 1000px;
height: 100px;
z-index: 99999;
}

#ajaxticker1 div{ /*IE6 bug fix when text is bold and fade effect (alpha filter) is enabled. Style inner DIV with same color as outer DIV*/
}

.someclass{ //class to apply to your scroller(s) if desired
}

</style>

<script src="ajaxticker.js" type="text/javascript">

/***********************************************
* Ajax Ticker script (txt file source)- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

</script>

<center><div class="topbackground">
<img id="Image-Maps_3201307070909053" src="http://deltaflow.com/themes/deltaflow/images/pixel_transparent.gif" usemap="#Image-Maps_3201307070909053" border="0" width="1000" height="122" alt="" />
<map id="_Image-Maps_3201307070909053" name="Image-Maps_3201307070909053">
<area shape="rect" coords="19,6,196,66" href="http://www.google.com" alt="" title=""    />
<area shape="rect" coords="232,7,409,67" href="http://www.google.com" alt="" title=""    />
<area shape="rect" coords="438,5,615,65" href="http://www.twitter.com/" alt="" title=""    />
<area shape="rect" coords="651,7,828,67" href="" alt="Coming Soon !" title="Coming Soon !"    />
<area shape="rect" coords="866,0,984,56" href="" alt="" title=""    />
<area shape="rect" coords="998,120,1000,122" href="http://www.image-maps.com/index.php?aff=mapped_users_3201307070909053" alt="Image Map" title="Image Map" />

<div class="realnewsbg">
</div>
<div class="realnews"><script type="text/javascript">
var xmlfile="tickercontent.txt" //path to ticker txt file on your server.
//ajax_ticker(xmlfile, divId, divClass, delay, optionalfadeornot)
new ajax_ticker(xmlfile, "ajaxticker1", "someclass", [3500], "fade")
</script></div></div>
<div class="header"></div>
</div>

Answer 1

您的导航栏没有移动：您的div .realnewsbg和.realnews是。

删除每个div上的float:left属性，然后移除margin-left上的.realnewsbg以使其正常工作。

缩小并缩小

1 个答案: