Меню не работает в IE - PullRequest
Новая
       13

Меню не работает в IE

1 голос
/ 20 февраля 2010

Я пытаюсь перестроить (обратите внимание, я в первую очередь разработчик приложений, очень мало знаю о веб-разработке, кроме HTML) веб-сайта для семейного бизнеса, и до сих пор сталкиваюсь с некоторыми проблемами. Система меню CSS, которую я построил, прекрасно работает в Firefox, но в Internet Explorer ни один из пунктов меню не появляется, когда указатель мыши находится над элементами главной панели. Основные задействованные файлы: http://www.preferencepools.com/test/ для страницы, http://www.preferencepools.com/test/default.css для основного CSS и http://www.preferencepools.com/test/menu_style.css для CSS, который должен контролировать меню. Может кто-нибудь сказать мне, что я делаю не так? У меня не так много времени, чтобы учиться, прежде чем нам понадобятся какие-то другие изменения, и я бы хотел выпустить это меню одновременно. Благодаря.

Ответы [ 4 ]

2 голосов
/ 20 февраля 2010

В зависимости от вашей версии IE, он может не поддерживать псевдокласс: hover так, как вы ожидаете.Это было решено многими разработчиками до вас, и если бы вы могли смиренно предложить вам полагаться на этот опыт, чтобы сделать работу за вас.

http://www.htmldog.com/articles/suckerfish/dropdowns/

Это дает вам возможность создавать простыевыпадающие выпадающие списки работают должным образом во всех основных браузерах (IE, Opera, Safari, Firefox) и очень легковесны (12 строк JavaScript).

1 голос
/ 20 февраля 2010

После просмотра вашего HTML, кажется, у вас есть несколько дополнительных тегов html и body.Попробуйте этот обновленный код и посмотрите, как он помогает: 

    <html>
<head>
<meta name="keywords" value="swimming pools, pools,
inground pools, spas, hot tubs, aboveground pools, underground pools,
pool chemicals, spa chemicals, hot tub chemicals, Roseburg, oregon,
douglas county, BioGuard, Spaguard, soft swim, Dimension One, Fort
Wayne, Baqua spa, baquacil, sun star, dough boy, seaspray,  sim pools,
splash pools, k-d pools, endless pools, swim spas, muskin pools, spa
covers, soft sided pools, garden leisure pools, swimming, summer,
Sunair, awnings, vinyl liners, swimming pool liners, aboveground liners,
replacement liners, liners, plasimayd, premier, discovery, hayward,
stayrite, pac fab, pentair, pool covers, safe-t-cover, cover pools,
solar blankets, solar reels, swimming pool pumps, pumps, swimming pool
filters, filters, swimming pool heater, heater, DE filter, sand filters,
filters, pool toys, toys, backyard, hot water, chemicals, algae, cloudy
water, pool problems, spa problems, pool trouble, spa trouble, water
problems, water trouble, water testing, free water testing, pool
testing, spa testing, spa maintenance, pool maintenance, new pools, pool
dealer, aboveground pool dealer, inground pool dealer, underground pool
dealer, spa dealer, hot tub dealer, hot tub problems, hot tub
maintenance">
<link rel="stylesheet" type="text/css" href="default.css" />
</head>
<title>Preference Pools & Spas</title>
<link rel="stylesheet" type="text/css" href="menu_style.css" />
</head>
<body style="padding:0;margin:0">
<div id="water">

    <div id="header">
        <h1 class="pptitle">
            <img src="images/pool.gif" alt="pool.gif" class="textalign">
            &nbsp;Preference Pools & Spas llc
        </h1>
        <br/>
        <ul id="navigation-1">
            <li><a href="./" accesskey="1" title="Home">Home</a></li>

            <li>
                <a href="#" accesskey="2" title="Pools">Pools</a>
                <ul class="navigation-2">
                    <li><a href="aboveground.php">Above Ground</a></li>
                    <li><a href="inground.php">In-Ground</a></li>
                    <li><a href="fiberglass.php">Viking Fiberglass</a></li>
                    <li><a href="neverending.php">Neverending</a></li>

                </ul>
            </li>
            <li>
                <a href="#" accesskey="3" title="Spas">Spas</a> 
                <ul class="navigation-2">
                    <li><a href="hotsprings.php">Hot Springs</a></li>
                    <li><a href="tiger.php">Tiger River</a></li>
                    <li><a href="solana.php">Solana</a></li>

                    <li><a href="hotspot.php">Hot Spot</a></li>
                    <li><a href="tidalfit.php">Tidal Fit</a></li>
                </ul>
            </li>
            <li>
                <a href="#" accesskey="4" title="Pool Chemicals">Pool Chemicals</a> 
                <ul class="navigation-2">
                    <li><a href="pchlorine.php">Chlorine</a></li>

                    <li><a href="psoftswim.php">Softswim</a></li>
                    <li><a href="psalt.php">Mineral Generation</a></li>
                    <li><a href="psilver.php">Silver</a></li>
                </ul>           
            </li>
            <li>
                <a href="#" accesskey="5" title="Spa Chemicals">Spa Chemicals</a>   
                <ul class="navigation-2">

                    <li><a href="sbromine.php">Bromine</a></li>
                    <li><a href="ssoftsoak.php">Soft Soak</a></li>
                    <li><a href="ssilver.php">Silver</a></li>
                </ul>
            </li>
            <li>
                <a href="#" accesskey="6" title="Service">Service</a>   
                <ul class="navigation-2">

                    <li><a href="svpool.php">Pool Service</a></li>
                    <li><a href="svspa.php">Spa Service</a></li>
                </ul>
            </li>
            <li>
                <a href="#" accesskey="7" title="Equipment">Equipment</a>   
                <ul class="navigation-2">
                    <li><a href="epool.php">Pool Equipment</a></li>

                    <li><a href="espa.php">Spa Equipment</a></li>
                </ul>
            </li>
            <li>
                <a href="#" accesskey="8" title="Liners and Covers">Liners and Covers</a>   
                <ul class="navigation-2">
                    <li><a href="liners.php">Pool Liners</a></li>
                    <li><a href="cpool.php">Pool Covers</a></li>

                    <li><a href="cspa.php">Spa Covers</a></li>
                </ul>
            </li>
            <li>
                <a href="#" accesskey="9" title="Company Info">Company Info</a> 
                <ul class="navigation-2">
                    <li><a href="about.php">About Us</a></li>
                    <li><a href="contact.php">Contact Us</a></li>

                </ul>
            </li>
            <!--<li>
                <a href="#" accesskey="0" title=""></a> 
                <ul class="navigation-2">
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                    <li><a href="#"></a></li>
                </ul>
            </li>-->
        </ul>
    </div>
</div>

<div align="center">
  <p align="left">Welcome to our home on the web. Please come on in and browse 
    our pages. We are working hard to bring you the best in swimming pool and 
    spa information, service, and chemicals. You can use the menus above to access our catalog of 
    information on pools, spas, and nearly everything that goes with them. Enjoy your stay 
    and don't hesitate to <a href="contact.htm">contact us</a> if necessary.</p>

  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <table width="65%" border="0" cellpadding="10" align="center">
    <tr> 
      <td width="19%"> 
        <div align="center"><a href="http://www.bioguard.com"><img src="logos/bioglogo.gif" width="125" height="100" align="absmiddle" border="0"></a></div>
      </td>
      <td width="17%"> 
        <div align="center"><a href="http://www.spaguard.com"><img src="logos/sglogo.gif" width="112" height="103" align="absmiddle" border="0"></a></div>
      </td>

      <td width="19%"> 
        <div align="center"><img src="logos/seaspraysm.jpg" width="170" height="74" align="absmiddle"></div>
      </td>
      <td width="19%"> 
        <div align="center"><a href="http://www.hotspringsspas.com"><img src="logos/hotsprings25annivlogo.jpg" width="180" height="91" align="absmiddle" border="0"></a></div>
      </td>
    </tr>
  </table>
  <table width="36%" border="0">
    <tr>

      <td width="29%"><a href="http://www.coverpools.com"><img src="logos/cpicorpo.gif" width="112" height="102" align="absmiddle" border="0"></a></td>
      <td width="21%"><a href="http://www.pacificpools.com"><img src="logos/pacific.jpg" width="214" height="117" align="absmiddle" border="0"></a></td>
      <td width="21%"><a href="http://www.technican.ca"><img src="logos/technican.jpg" width="352" height="67" align="absmiddle" border="0"></a></td>
      <td width="50%"><a href="http://www.sunstar.com"><img src="logos/sunstar.gif" width="95" height="86" align="absmiddle" border="0"></a></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <div id="footer">
  <p id="footer">Preference Pools &amp; Spas LLC<br>

    787 W. Harvard Ave.<br>
    Roseburg, Or. 97470<br>
    (541) 672-1970</p>
  <p align="left">&nbsp;</p>
  <p id="footer">Site Design by <a href="mailto:webmaster@preferencepools.com">Tom 
    Andrecht</a></p>
  <p id="footer"><a href="copyright.htm">&copy;Copyright Information Here</a></p>

  </div>

  <div align="center"> 
  </div>
</div>
</body>
</html>
1 голос
/ 20 февраля 2010

Версии IE <6 или IE7 + в режиме причуд не поймут <code>:hover.IE6 - это другая история (вы можете захотеть использовать JavaScript, чтобы он работал одинаково во всех браузерах), но с IE7 + вам нужно использовать переключатель типа , чтобы перевести IE в стандартный режим , где он будет уважать;

1 голос
/ 20 февраля 2010

Я изучил вашу проблему, и я не уверен, что именно происходит. Перед просмотром вашего сайта я предположил, что проблема была только в IE6 и 7, которые обычно имеют проблемы. Тем не менее, похоже, что они также не работают в IE8. К сожалению, это может быть легко исправить вашу проблему в IE8, но это будет намного сложнее в IE6 и 7 из-за множества проблем обратной совместимости. Вместо того, чтобы биться головой об стену, я бы предложил вам попробовать что-то вроде элементов управления Spry Menu, найденных здесь . Они сделают все, что вы ищете, очень быстро и легко, и в них уже встроена обратная совместимость.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...