проблемы с ползунком JavaScript в Firefox - PullRequest
0 голосов
/ 23 ноября 2010

Я изо всех сил пытаюсь найти решение этой проблемы в любом месте.Я создал слайдер, который отлично работает в Safari, но когда я смотрю его в Firefox, изображение слайдера 1 не имеет поля между изображением слайдера 2 и ни 2 с 3 и так далее.Создание последовательности изображений, которые никогда не помещаются в окне ползунка (почти как открытие лифта в случайных точках между этажами).

Вторая проблема, с которой я столкнулся, заключается в создании изображения слайдера в качестве ссылки, в отличие от заголовка .content h2, являющегося ссылкой.

Ползунок в теме Wordpress Epione.

любая помощь будет принята с благодарностью

это мой css-

/*SLIDER*/

#sliderwrap{float:left; width:auto; height:auto; background:none; margin-left:0px;        margin-top:px; position:; z-index:3;}

.slidercontent{ margin-top:20px;width:auto; height:auto;}

#slider{ margin-left:0px; margin-top:0px; width:auto; height:auto;}



.content{ width:auto; margin-right:auto;}

.content p{ font-style:none; font-size:14px;}

.content h2{ position: relative; left: -650px; top:490px; font-family: 'helvetica;      colour:#00000; font-size:10px; margin-bottom:15px; margin-top:20px;display:}

.content h2 a{ color:#00000; display:block; margin-left: 700px; text-decoration:none; text-shadow:none; text-transform:uppercase;}



#slider img{width:auto; height:auto; ; margin-left:0px; margin-top:22px; min-height:225px; }

.sframe{ background:url(images/sliderimg.png) no-repeat; float:center; ; height:auto; float:center; position:; z-index:0; margin-top:12px; margin-left:60px;}


.sl_control{ float:left; width:100px; height:5px; background:none; margin-top:-10px; margin-right:12px; position:relative;}



/* Easy Slider */

#slider ul, #slider li{margin:0;padding:0;list-style:none;}

#slider li, #slider2 li{ width:1000px;height:1100px} 



#nextBtn{display:block; width:13px; height:14px; position:relative; left0px; top:0px; z- index:1000; right:120px; top:-718px; float:left; left:775px; margin-right:20px; }

#prevBtn{display:block; width:13px; height:14px; position:relative; left:300px; top:0px; z-index:1000; right:120px; top:-718px; float:left; left:-0px; margin-right:20px; }  


#prevBtn{ left:-20px;}              
#nextBtn a, #prevBtn a{  display:block;position:relative;width:13px;height:14px;
background:url(images/sl_left.png) no-repeat 0 0;} 

#nextBtn a{ background:url(images/sl_right.png) no-repeat 0 0;}

.graphic, #prevBtn, #nextBtn{padding:0; display:block; overflow:hidden; text-indent:-8000px;}


/* Easy Slider END */

/*SLIDER END*/

и первая страница, где появляется .php

<?php get_header(); ?>



<!--SLIDER-->

<div id="sliderwrap">
  • ">

</div>

<div class="sl_control"></div>

<!--SLIDER END-->



<!--CONTENT-->

















</div>

</div>

<!--CONTENT END-->





<!--SIDEBAR-->



<?php get_sidebar(); ?>



<!--SIDEBAR END-->



</div>

<!--Footer-->

<?php get_footer(); ?>

1 Ответ

0 голосов
/ 24 ноября 2010

Прежде всего:

Ваш CSS не проверяется, и я предполагаю, что у Firefox возникли проблемы с его синтаксическим анализом.Попробуйте скопировать и вставить этот фрагмент в http://jigsaw.w3.org/css-validator/, чтобы понять, что я имею в виду.Ниже приведено несколько (несколько) исправленных CSS: </p> <pre><code>/* SLIDER */ #sliderwrap {float: left; width: auto; height: auto; background: none; margin-left: 0px; z-index: 3;} .slidercontent {margin-top:20px; width:auto; height:auto;} #slider {margin-left: 0px; margin-top: 0px; width: auto; height: auto;} .content{ width:auto; margin-right:auto;} .content p{ font-style:none; font-size:14px;} .content h2{ position: relative; left: -650px; top:490px; font-family: sans-serif; colour: #000000; font-size:10px; margin-bottom:15px; margin-top:20px;} .content h2 a{ color:#000000; display:block; margin-left: 700px; text-decoration:none; text-shadow:none; text-transform:uppercase;} #slider img{width:auto; height:auto; margin-left:0px; margin-top:22px; min-height:225px; } .sframe{ background:url(images/sliderimg.png) no-repeat; height:auto; float:center; z-index:0; margin-top:12px; margin-left:60px;} .sl_control{ float:left; width:100px; height:5px; background:none; margin-top:-10px; margin-right:12px; position:relative;} /* Easy Slider */ #slider ul, #slider li{margin:0;padding:0;list-style:none;} #slider li, #slider2 li{ width:1000px;height:1100px;} #nextBtn{display:block; width:13px; height:14px; position:relative; left:0px; top:0px; z- index:1000; right:120px; top:-718px; float:left; left:775px; margin-right:20px; } #prevBtn{display:block; width:13px; height:14px; position:relative; left:300px; top:0px; z-index:1000; right:120px; top:-718px; float:left; left:-0px; margin-right:20px; } #prevBtn{ left:-20px;} #nextBtn a, #prevBtn a{ display:block;position:relative;width:13px;height:14px; background:url(images/sl_left.png) no-repeat 0 0;} #nextBtn a{ background:url(images/sl_right.png) no-repeat 0 0;} .graphic, #prevBtn, #nextBtn{padding:0; display:block; overflow:hidden; text-indent:-8000px;} /* Easy Slider END */ /*SLIDER END*/

Обратите внимание, что это по-прежнему не будет анализироваться по нескольким причинам - во-первых, float тоже "влево или вправо";Вы не можете сделать это "центр".Чтобы сделать это с помощью чисел с плавающей точкой, вам нужно сделать что-то вроде «margin-left: 50%;»Во-вторых, шрифты всегда стилизованы каким-либо образом - вы не можете объявить стиль шрифта как «none».Я оставил их выше, потому что я не уверен, как вы хотите с этим справиться.

В любом случае, вы можете переходить на разные таблицы стилей на основе браузера в PHP;см .: http://php.about.com/od/learnphp/p/http_user_agent.htm

Надеюсь, это поможет!

-æ.

...