Banner Header (Roll-over effect) and Sidebar HELP

  • Here is my problem:

    Roll Over
    See the header file? If you could notice, there are three icons right? facebook, twitter, and rss. What I want to do is to individually assign a link to each of them. Plus, I would also like to add a hover effect where each icon would be replaced with the same icon BUT with opacity 100% (to make it full colored). Any ideas?

    Thanks to all of you in advance.

    Here’s the header code at any rate:

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
    <html xmlns=”https://www.w3.org/1999/xhtml”&gt;

    <head profile=”https://gmpg.org/xfn/11″&gt;
    <meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />

    <title><?php bloginfo(‘name’); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>

    <meta name=”generator” content=”WordPress <?php bloginfo(‘version’); ?>” /> <!– leave this for stats –>

    <link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”all” />
    <link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
    <link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>” />
    <script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/jquery-1.2.6.min.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/fx.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/jquery.easing.min.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/jquery.lavalamp.js”></script>

    <script type=”text/javascript”><!–//–><![CDATA-[//><!–
    sfHover = function() {
    if (!document.getElementsByTagName) return false;
    var sfEls = document.getElementById(“menu”).getElementsByTagName(“li”);

    for (var i=0; i<sfEls.length; i++) {
    sfEls[i].onmouseover=function() {
    this.className+=” sfhover”;
    }
    sfEls[i].onmouseout=function() {
    this.className=this.className.replace(new RegExp(” sfhover\\b”), “”);
    }
    }

    }
    if (window.attachEvent) window.attachEvent(“onload”, sfHover);
    //–><!]]></script>
    <?php wp_get_archives(‘type=monthly&format=link’); ?>
    <?php //comments_popup_script(); // off by default ?>

    <?php wp_head(); ?>
    </head>
    <body>
    <div id=”main”>
    <div id=”header”>
    <div id=”menubar”>
    <div style=”float:left; “>
    <ul class=”lavaLampNoImage” id=”A”>

    • /”>Home

      • <?php wp_list_pages(‘sort_column=menu_order&depth=1&title_li=’);?>

      </div>

      <div id=”logo”>
      <h1>/”></h1>
      <div class=”description”><?php bloginfo(‘description’); ?></div>
      </div>

      <div id=”headerad”>
      <?php $ad3 = get_option(‘omg_ad3’); echo stripslashes($ad3); ?>
      </div>
      </div>
      <div id=”cmenubar”>
      <div id=”cmenu”>

      <?php wp_list_categories(‘sort_column=name&title_li=&depth=4’); ?>

    </div>
    </div>
    </div>
    <!–/header –>

Viewing 2 replies - 16 through 17 (of 17 total)
Viewing 2 replies - 16 through 17 (of 17 total)
  • The topic ‘Banner Header (Roll-over effect) and Sidebar HELP’ is closed to new replies.