2013-02-26 7 views
1

Работал с фиксированным заголовком для моего сайта. и его повсюду. все, что прошлое плагинов Wordpress смущает меня, LOL. но я смог получить его половину работы. На мозилле это выглядит так, как я этого хотел, но на сафари и хром. а также видео на странице перекрывают заголовок. любой совет?Фиксированный фиксированный заголовок

header.php:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>> 
<head> 
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 

    <title><?php ui::title(); ?></title> 

    <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" /> 

    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php ui::rss(); ?>" /> 
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> 

    <?php ui::head(); ?> 

</head> 
<body <?php body_class() ?>> 
<script> 
$("iframe").each(function(){ 
    var ifr_source = $(this).attr('src'); 
    var wmode = "wmode=transparent"; 
    if(ifr_source.indexOf('?') != -1) { 
     var getQString = ifr_source.split('?'); 
     var oldString = getQString[1]; 
     var newString = getQString[0]; 
      $(this).attr('src',newString+'?'+wmode+'&'+oldString); 
    } 
    else $(this).attr('src',ifr_source+'?'+wmode); 
});</script> 

<div id="header-fixed"> 
<div id="logo"><a href="http://ngaradio.org/"><img src="http://ngaradio.org/wp-content/uploads/2012/11/NewTop.png" alt="NGA Radio"></a></div> 

    <div id="my-menus"> 
<div class="wrapper"> 
<?php if (option::get('menu_top_show') == 'on') { 
if (has_nav_menu('secondary')) { 
wp_nav_menu(array('container' => '', 'container_class' => '', 'menu_class' => '', 'menu_id' => '', 'sort_column' => 'menu_order', 'depth' => '1', 'theme_location' => 'secondary')); 
} 
else 
{ 
echo '<ul><li>Please set your Top Menu on the <a href="'.get_admin_url().'nav-menus.php">Appearance > Menus</a> page or disable it from the <a href="'.get_admin_url().'admin.php?page=wpzoom_options">WPZOOM Theme Options</a> page, General tab.</li></ul>'; 
} 
} // if menu top show 
?> 
<?php if (option::get('social_icons_show') == 'on') { ?> 
<ul id="social-links"> 
<?php if (option::get('social_icons_facebook')) { ?><a href="<?php echo option::get('social_icons_facebook'); ?>" rel="external,nofollow"><img src="<?php bloginfo('template_url'); ?>/images/icons/ic_facebook.png" alt="" /></a> - <?php } ?> 
<?php if (option::get('social_icons_twitter')) { ?><a href="<?php echo option::get('social_icons_twitter'); ?>" rel="external,nofollow"><img src="<?php bloginfo('template_url'); ?>/images/icons/ic_twitter.png" alt="" /></a> - <?php } ?> 
<?php if (option::get('social_icons_youtube')) { ?><a href="<?php echo option::get('social_icons_youtube'); ?>" rel="external,nofollow"><img src="<?php bloginfo('template_url'); ?>/images/icons/ic_youtube.png" alt="" /></a> - <?php } ?> 
<a href="<?php ui::rss(); ?>"><img src="<?php bloginfo('template_url'); ?>/images/icons/ic_rss.png" alt="" /></a> 
</ul><!-- end #social-links --> 
<?php } ?></div> 

<div id="player"> 
<iframe src="http://www.streamlicensing.com/stations/testing/fahq.html" style="border:0px #FFFFFF none;" name="NGA Radio" scrolling="no" frameborder="1" marginheight="0px" marginwidth="0px" height="32px" width="500px"></iframe></div> 
    </div> 
</div> 

<div id="container"> 

<!-- stat #pre-header --> 

    <header id="header"> 
     <div class="wrapper"> 

      <!-- #logo --> 

      <?php if (option::get('banner_header_enable') == 'on') { ?> 
      <div class="header-banner"> 

       <?php if (option::get('banner_header_html') <> "") { 
        echo stripslashes(option::get('banner_header_html'));    
       } else { ?> 
        <a href="<?php echo option::get('banner_header_url'); ?>" rel="nofollow" title="<?php echo option::get('banner_header_alt'); ?>"><img src="<?php echo option::get('banner_header'); ?>" alt="<?php echo option::get('banner_header_alt'); ?>" /></a> 
       <?php } ?>   

      </div><!-- end .header-banner --> 
      <?php } ?> 

      <div class="cleaner">&nbsp;</div> 

     </div><!-- end .wrapper --> 

     <nav id="header-menu"> 

      <div class="wrapper"> 

       <?php if (has_nav_menu('primary')) { 
        wp_nav_menu(array('container' => '', 'container_class' => '', 'menu_class' => 'dropdown', 'menu_id' => 'main-menu', 'sort_column' => 'menu_order', 'theme_location' => 'primary')); 
       } 
       else 
       { 
        echo '<p>Please set your Main Menu on the <a href="'.get_admin_url().'nav-menus.php">Appearance > Menus</a> page. For more information please <a href="http://www.wpzoom.com/documentation/morning/">read the documentation</a>.</p>'; 
       } 
       ?> 

      </div><!-- end .wrapper --> 

     </nav> 

    </header><!-- end header --> 
<p></p><p></p><p></p><br><br><br><br><br><br><br><br><br><br><br><br><br><br> 
    <section id="main"> 

CSS:

#header-menu { 
    position: fixed; 
    top: 114px; 
    margin: auto; 
    left: 150px; 
    z-index: 100; 
    opacity: .8; 
} 

#logo { 
    position: fixed; 
    top: -40px; 
    margin: auto; 
    left: 0; 
    z-index: 1; 
} 

#social-links { 
    position: fixed; 
    top: 156px; 
    right: 50px; 
    margin: auto; 
    z-index: 1000; 
    width: 100%; 
} 

#player { 
    position: fixed; 
    top: 108px; 
    left: -210px; 
    margin: auto; 
    z-index: 10000; 
    width: 100%; 
} 

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

Сайт находится на http://ngaradio.org

ответ

0

Это, безусловно, из-за z-index в CSS. Дайте более высокое число для элементов, которые вы хотите получить сверху :) Столкнулась с подобной проблемой много раз. Если вы хотите, чтобы заголовок был сверху, всегда давайте более высокий номер z-index для CSS, чем видео или что-то еще. Вы даете 10000 для видео и 100 для заголовка. Отсюда и эффект.

Смежные вопросы