The secure CMS.

Welcome to Geeklog, Anonymous Thursday, November 28 2024 @ 01:08 am EST

Geeklog Forums

popup logo

 New Topic  Post Reply
 06/06/07 08:43am (Read 2,471 times)  
Status: offline

trampoline

Forum User
Full Member
Registered: 02/24/06
Posts: 392
I would like a logo that had a pop up action, this is so the logo can be actually read as it is a large image and reduced to logo size it is not legible, also I want the popup to be in 3 seperate languages preferably popping up seperately but all together is ok.

so in short when you hover over the logo a large image of the Logo pops up so you can study it, this is vital for my site.

Any help most apreciated...
 Quote
 06/09/07 11:52am  
Status: offline

trampoline

Forum User
Full Member
Registered: 02/24/06
Posts: 392
WEll I have some code for a pop up logo, it is CSS but I still do not know how to implement a CSS popup logo into the header.

I have this function / code...
Text Formatted Code

<body class="sitebody" dir="{direction}">
<div id="set_of_links">
<a href="javascript:;"><img src="10.gif" />

<span class="site_1"></span>

</a>
</div><!-- /set_of_links -->
 


and this CSS code...
Text Formatted Code

/* Logo popup CSS */

div#set_of_links {
        position:relative;
        padding:9px;
        border:1px dotted #999;
        background-color:#fff;
        margin-bottom:20px
}
div#set_of_links a {
        display:inline;
        padding:0px 9px 0px 9px;
        text-decoration:none;
        color:maroon
}
div#set_of_links a:hover {
        background:transparent
}
div#set_of_links a span {
        display:none
}
div#set_of_links a:hover span {
        display:inline;
        position:absolute;
        top:9px;
        left:100px;
        width:340px;
        height:150px
}
.site_1 {background:url(images/tibetlogo2.gif) no-repeat top left}
.site_2 {background:url(images/b_20.gif) no-repeat top left}
.site_3 {background:url(images/b_60.gif) no-repeat top left}
.site_4 {background:url(images/b_70.gif) no-repeat top left}
 


So how do I get this into my header which at the moment looks like this...
Text Formatted Code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>{page_title}</title>
<!-- link rel="SHORTCUT ICON" href="{site_url}/favicon.ico" -->

<meta http-equiv="Pragma" content="no-cache">

<link rel="stylesheet" type="text/css" href="{css_url}" title="{theme}">
{feed_url}
{rel_links}
{plg_headercode}
{advanced_editor}
<!-- Load Common Javascript Libraries -->
<script type="text/javascript" src="{site_url}/javascript/common.js"></script>

</head>

<body dir="{direction}">
    <div class="header-navigation-container">
        <div class="header-navigation-line">

        </div>
    </div>
    <div class="header-logobg-container-outer">
        <table width="100%" border="0" cellpadding="0" cellspacing="0" class="header-logobg-container-inner">
            <tr>
                <td class="header-logobg-left">
                    <a href="{site_url}/"><img src="{site_url}/tibet.jpg" width="100%" height="90" alt="{site_name}" border="0" align="centre"></a>
                </td>
                <!-- <td class="header-logobg-right">
                    <span class="site-slogan">{site_slogan}</span>
                </td> -->
            </tr>
            <td colspan="2" style="padding:0px;margin:0px;background:#transparent">{glmenu}</td>
<!-- <td style="padding:0px;margin:0px;background:#406E9B;"><img src="{layout_url}/images/speck.gif" width="900" height="1"></td> -->
        </table>
    </div>
    <table border="0" cellspacing="0" cellpadding="0" width="100%">
        <tr>
            {left_blocks}
            <td class="story-container" width="100%" style="vertical-align:top;">
                <div class="header-welcomeanddate-box">
                    <div class="header-welcomeanddate-text">
                        <a href="{site_url}">{welcome_msg}</a><br>{datetime}
                    </div>
                </div>

                <!-- START OF CONTENT AREA -->
 


If anyone can help I would be very greatful.

at the moment I have utilised the LOGO Image for a background image which works very well on the site...
I want the logo to be far left and small in the header and then it will pop out on hover...
http://www.tenanttalk.co.uk
 Quote
 New Topic  Post Reply
All times are EST. The time is now 01:08 am.
  • Normal Topic
  • Sticky Topic
  • Locked Topic
  • New Post
  • Sticky Topic W/ New Post
  • Locked Topic W/ New Post
  •  View Anonymous Posts
  •  Able to post
  •  Filtered HTML Allowed
  •  Censored Content