在最小化/最大化期间滑动图像对准改变 [英] Sliding image alignment changes during minimizing/maximizing
问题描述
我在下面提到了HTML和CSS代码，请在哪里以及我需要做些什么更改才能解决此问题。每当我在最大化的浏览器中打开一个网站时，它就会正常运行。但是，只要我最小化浏览器并最大化它，我的滑动图像就会移动到其他地方。如果您需要任何其他信息，请告诉我
< html dir =ltrlang =language;？>>
< head>
< jdoc：include type =headxmlns：jdoc =＃unknown>
<！ - 滚动head - >
< script src =/ js / scroling.js>< / script>
< script type =text / javascript >
$（function（）{
$（窗口）.scroll（function（）{
if（$（this） .scrollTop（）！= 0）{
$（'＃toTop'）。fadeIn（）;
} else {
$（ '#toTop'）。fadeOut（）;
}
}）;
$（'＃toTop'）。click（function（function（ ）{
$（'body，html'）。animate（{scrollTop：0}，800）;
}）;
} ）;
< / script>
<！ - 结束滚动 - >
<！ - animacja-- >
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js> ;
< / script>
< script type =text / javascriptsrc =/ js / s3Slider.js> < / script>
< script type =text / javascript>
$（document）.ready（function（）{
$（'＃slider1'）。s3Slider（{
timeOut：4000
}）;
}）;
< / script>
<！ - end animacja - >< / script>
< ; - animacja grafika - >
I've mentioned below the HTML and CSS code, please where and what changes I have to do to remove this problem. Whenever i open a website in a maximized browser it ups and the sliding image works properly. However, as soon as I minimize the browser and maximize it, my sliding image move somewhere else. if you require any other info, do let me know
<html dir="ltr" lang="language; ?>">
<head>
<jdoc:include type="head" xmlns:jdoc="#unknown">
<!--scroling head-->
<script src="/js/scroling.js"></script>
<script type="text/javascript">
$(function() {
$(window).scroll(function() {
if($(this).scrollTop() != 0) {
$('#toTop').fadeIn();
} else {
$('#toTop').fadeOut();
}
});
$('#toTop').click(function() {
$('body,html').animate({scrollTop:0},800);
});
});
</script>
<!--end scroling-->
<!--animacja-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script type="text/javascript" src="/js/s3Slider.js"> </script>
<script type="text/javascript">
$(document).ready(function() {
$('#slider1').s3Slider({
timeOut: 4000
});
});
</script>
<!--end animacja--></script>
<!--animacja grafika-->
<！ - konec animacja grafika - >
<!--konec animacja grafika-->
params-> get（'siteTitle'）; ？>
params-> get（'siteSlogan'）; ？>
params- >get('siteTitle'); ?>
params->get('siteSlogan'); ?>
`
------------ CSS ---------------- ---
.dd-shapes
{
职位：绝对;
top：0;
right：0;
bottom：0;
left：0;
溢出：隐藏;
z-index：0;
}
.dd-slider-inner
{
位置：相对;
溢出：隐藏;
宽度：100％;
身高：100％;
}
.dd-slidenavigator> a
{
显示：内联块;
vertical-align：middle;
outline-style：没有;
字体大小：1px;
}
.dd-slidenavigator> a：最后一个孩子
{
margin-right：0！important;
}
div.item-page .panel .pane-slider
{
保证金：0;
填充：0;
}
＃slider1 {
宽度：942px; / *与图像宽度相同很重要* /
身高：276像素; / *与图像高度相同很重要* /
位置：相对; / * important * /
溢出：隐藏; / * important * /
}
＃slider1Content {
宽度：720px; / *重要的是与图像宽度相同或更宽* /
位置：绝对;
顶部：0;
margin-left：0 ;
}
.slider1Image {
float：left;
position：relative;
显示：无;
}
.slider1Image span {
position：absolute;
font： 12px / 15px Arial，Helvetica，sans-serif;
填充：10px 13px;
宽度：694px;
背景颜色：＃000 ;
过滤器：alpha（不透明度= 70）;
-moz-opacity：0.7;
-khtml-opacity：0.7;
不透明度：0.7;
颜色：#fff;
显示：无;
}
.slider1Image span strong {
font-size：16px;
}
`
------------CSS-------------------
.dd-shapes
{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: 0;
}
.dd-slider-inner
{
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
}
.dd-slidenavigator > a
{
display: inline-block;
vertical-align: middle;
outline-style: none;
font-size: 1px;
}
.dd-slidenavigator > a:last-child
{
margin-right: 0 !important;
}
div.item-page .panel .pane-slider
{
margin: 0;
padding: 0;
}
#slider1 {
width: 942px; /* important to be same as image width */
height: 276px; /* important to be same as image height */
position: relative; /* important */
overflow: hidden; /* important */
}
#slider1Content {
width: 720px; /* important to be same as image width or wider */
position: absolute;
top: 0;
margin-left: 0;
}
.slider1Image {
float: left;
position: relative;
display: none;
}
.slider1Image span {
position: absolute;
font: 12px/15px Arial, Helvetica, sans-serif;
padding: 10px 13px;
width: 694px;
background-color: #000;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
display: none;
}
.slider1Image span strong {
font-size: 16px;
}
推荐答案
（function（ ）{
(function() {
（窗口）.scroll（function（）{
if（
(window).scroll(function() {
if(
（this ）.scrollTop（）！= 0）{
(this).scrollTop() != 0) {
这篇关于在最小化/最大化期间滑动图像对准改变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
