Jump to content

Help: Map image files and Iframe appears at the bottom?

Hall of Famer

By Hall of Famer
in CSS Help

 Share

Recommended Posts

Hall of Famer Regular Member

Hall of Famer

Posted
Posted

Well I am encountering an issue that makes me unable to sleep. The template design seems to have gone wrong and it messed up my script file for map.php and fishingquiz.php. I used an image map file and iframe window to load contents from another script file, but now it seems that I cant. The two files are now heavily messed up because of this 'layer problem'. I'd like to have the image and iframe appear on top, not bottom. Here are the urls to the two files:

 

http://www.pokemansion.net/map.php

http://www.pokemansion.net/fishingquiz.php

 

I've also attached the contents of css file and the two script files here, please help me.

 

 

CSS:

/*New additions*/

body{
background-image:url(background.gif);
background-repeat:repeat;	
font-family:"Trebuchet MS" Arial, Helvetica, sans-serif;
font-size:8pt; 
color:#222222;
    height:100%;
margin:0;
padding:0;
}

#wrapper{
width:800px;
margin:0px auto;
position:relative;	
}

.logo{
background:#FFF;
width:100%;
height:150px;
position:absolute;
z-index:2;
}

#container{
padding-top:150px;
width:100%;
background:#FFF;
position:absolute;
}

.footer{
width:100%;
height:50px;
position:absolute;
left:0%;
top:100%;
background-image:url(footer.gif);
background-repeat:repeat-x;
font-style:italic;
font-size:0.8em;
color:#FFF;
}

.link{
color:#FFF;
font-size:0.9em;
text-decoration:none;
}

.link:hover{
color:#FFF;
font-size:0.9em;
text-decoration:underline;
}



/*dropdown menu's css*/
.bg {
background: url(images/button4.gif);
}

.menu {
padding:0 0 0 32px;
margin:0;
list-style:none;
height:40px;
background:#fff url(images/button1a.gif) repeat-x;
position:relative;
font-family:arial, verdana, sans-serif;
}

.menu li.top {
display:block;
float:left;
position:relative;
}

.menu li a.top_link {
display:block;
float:left;
height:40px;
line-height:33px;
color:#fff;
text-decoration:none;
font-size:11px !important;
font-weight:bold;
padding:0 0 0 12px;
cursor:pointer;
}

.menu li a.top_link span {
float:left;
font-weight:bold;
display:block;
padding:0 24px 0 12px;
height:40px;
}

.menu li a.top_link span.down {
float:left;
display:block;
padding:0 24px 0 12px;
height:40px;
background:url(images/down.gif) no-repeat right top;
}

.menu li a.top_link:hover {
color:#000;
background: url(images/button4.gif) no-repeat;
}

.menu li a.top_link:hover span {
background:url(images/button4.gif) no-repeat right top;
}

.menu li a.top_link:hover span.down {
background:url(images/button4a.gif) no-repeat right top;
}

.menu li:hover > a.top_link {
color:#000;
background: url(images/button4.gif) no-repeat;
}

.menu li:hover > a.top_link span {
background:url(images/button4.gif) no-repeat right top;
}

.menu li:hover > a.top_link span.down {
background:url(images/button4a.gif) no-repeat right top;
}

.menu table {
border-collapse:collapse;
width:0;
height:0;
position:absolute;
top:0;
left:0;
}

.menu a:hover {
visibility:visible;
}

.menu li:hover {
position:relative;
z-index:200;
}

.menu ul,.menu :hover ul ul,.menu :hover ul :hover ul ul,.menu :hover ul :hover ul :hover ul ul,
.menu :hover ul :hover ul :hover ul :hover ul ul {
position:absolute;
left:-9999px;
top:-9999px;
width:0;
height:0;
margin:0;
padding:0;
list-style:none;
}

.menu :hover ul.sub {
left:2px;
top:40px;
right:2px;
background: #fff;
padding:3px 0;
border:1px solid #95d2ee;
white-space:nowrap;
width:200px;
height:auto;
}

.menu :hover ul.sub li {
display:block;
height:20px;
position:relative;
float:left;
width:250px;
}

.menu :hover ul.sub li a {
font-weight:normal;
display:block;
font-size:11px;
height:20px;
width:192px;
line-height:20px;
text-indent:5px;
color:#000;
text-decoration:none;
border:3px solid #fff;
border-width:0 0 0 3px;
}

.menu :hover ul.sub li a.fly {
background:#fff url(images/arrow.gif) 80px 7px no-repeat;
}

.menu :hover ul.sub li a:hover {
background:#95d2ee;
color:#fff;
}

.menu :hover ul.sub li a.fly:hover {
background:#95d2ee url(images/arrow_over.gif) 80px 7px no-repeat;
color:#fff;
}

.menu :hover ul li:hover > a.fly {
background:#95d2ee url(images/arrow_over.gif) 80px 7px no-repeat;
color:#fff;
} 

.menu :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul :hover ul {
left:90px;
top:-4px;
background: #fff;
padding:3px 0;
border:1px solid 95d2ee;
white-space:nowrap;
width:93px;
z-index:200;
height:auto;
}

#username, #password{
width:120px !important;
}

/*End New Additions*/




/*  
Theme Name: Ginger Ninja! v2
Description: The new Ginger Ninja! theme.
Version: 1.0
Author: Donny Burnside
Author URI: http://www.ginger-ninja.net/
*/

/* Generic Styling */

img {
border:0;
}

p {
margin-bottom:1.75em;
}

a {
text-decoration:none;
color:#14b7dd;
}
a:hover {
text-decoration:none;
color:#14b7dd;
}

/* Structure */

#header {
height:140px;
background:url(http://www.pokemonmysidia.com/forum/pokemansionstyle/logo.png) no-repeat;
}

#sidebar {
float:right;
width:180px;
background:#efefef;
margin-right:10px;
}
#content {
float:left;
width:500px;

    min-height:400px;
}

/* Entries */

.entry {
padding:5px 10px;
text-align:justify;
line-height:1.75em;
}
.entry-title {
font-size:1.90em;
font-weight:normal;
letter-spacing:-1px;
}
.date {
font-size:0.9em;
color:#bbb;
cursor:default;
letter-spacing:1px;
}
.comments {
margin-top:-1em;
}
.comments a {
color:#6CC7DC;
background:url(images/icon-comment.png) no-repeat 0px 2px;
padding-left:20px;
padding-right:2px;
}
.comments a:hover {
color:#B4C835;
}


/* Sidebar */

#sidebar ul {
list-style-type:none;
margin-top:10px;
}
#sidebar li {

}
#sidebar li a {
display:block;
height:20px;
line-height:20px;
color:#222222;
padding-left:5px;
border-bottom:1px solid #dddddd;
}
#sidebar li a:hover {
background:#edebed;
color:#6CC4D8;
}
#sidebar-bottom {
height:20px;
background:url(images/bg-sidebar-bottom.gif) no-repeat top center;
}


h1 {
font-size:2.5em;
font-weight:normal;
cursor:default;
position:relative; top:50px; left:30px;
letter-spacing:1px;
color:#aaaaaa;
font-style:italic;
}

/* Feed */

#feed {
height:25px;
width:126px;
background:url(images/bg-feed.gif) no-repeat;
margin:0 auto;
padding-left:26px;
}
a.feed-button {
display:block;
    width:100px;
    height:25px;
    background:url("images/button-feed.png") 0 0 no-repeat;
    text-decoration: none;
}
a:hover.feed-button {
background-position:0 -25px;
}

/* Extra's */

#ad-top {
width:480px;
height:72px;
background:url(images/bg-ad-top.png) no-repeat;
padding:5px;
}

 

 

Map:

<html>
<head>

</head>
<body>

<div style="position: absolute; left: 282px; top: 175px;"> 

<img border="0" alt="pokemap" src="http://www.pokemansion.net/picuploads/other/pokemap.PNG" id="pokemap" onMouseOver="mouseOver()" onMouseOut="mouseOut()" usemap="#pokemap" />

<map name="pokemap">
<area shape="rect" coords="227,174,275,225" title="Trainer Info" alt="Trainer Info" href="http://www.pokemansion.net/account.php" />
<area shape="rect" coords="124,142,185,216" title="Mysidian's Board" alt="Mysidian's Board" href="http://www.pokemonmysidia.com/forum/forum.php" />
<area shape="rect" coords="187,72,263,123" title="Poke Lab" alt="Poke Lab" href="http://www.pokemansion.net/adopt.php" />
<area shape="rect" coords="209,274,275,322" title="Members List" alt="Members List" href="http://www.pokemansion.net/profile.php" />
<area shape="rect" coords="119,76,147,111" title="My Pokemon" alt="My Pokemon" href="http://www.pokemansion.net/myadopts.php" />
<area shape="rect" coords="544,167,591,217" title="My cash" alt="My Cash" href="http://www.pokemansion.net/mycash.php" />
<area shape="rect" coords="415,124,473,173" title="Pokecenter" alt="Pokecenter" href="http://www.pokemansion.net/pokemoncenter.php" />
<area shape="rect" coords="448,308,488,356" title="Pokemart" alt="Pokemart" href="http://www.pokemansion.net/shop.php" />
<area shape="rect" coords="490,308,530,356" title="My Inventory" alt="My Inventory" href="http://www.pokemansion.net/inventory.php" />
<area shape="rect" coords="376,63,450,113" title="Admin Controlpanel" alt="Admin Controlpanel" href="http://www.pokemansion.net/admin.php" />
</map>

</div>
</font>
<?php

// Wake the sleeping giant

// **********************************************************************
// Basic Configuration Info
// **********************************************************************

include("inc/functions.php");
include("inc/config.php");
include("inc/bbcode.php");

$themeurl = grabanysetting("themeurl");

// **********************************************************************
// Define our top links by calling getlinks()
// **********************************************************************

$links = getlinks();

// **********************************************************************
// Define our ads by calling getads()
// **********************************************************************

$ads = getads("any");

// **********************************************************************
// Grab any dynamic article content from the content table
// **********************************************************************

$pagecontent = getsitecontent("");
$article_title = $pagecontent[title];
$article_content = $pagecontent[content];


// Convert the BBCODE to HTML
$article_content = bbconvert($article_content);

// Convert line breaks to <br>
$article_content = nl2br($article_content);

// **********************************************************************
// Grab any settings that we will need for the current page from the DB
// **********************************************************************

$browsertitle = grabanysetting("browsertitle");
$sitename = grabanysetting("sitename");
$slogan = grabanysetting("slogan");

// **********************************************************************
// Check and see if the user is logged in to the site
// **********************************************************************

$loginstatus = logincheck();
$isloggedin = $loginstatus[loginstatus];
$loggedinname = $loginstatus[username];

// **********************************************************************
// End Prepwork - Output the page to the user
// **********************************************************************
// **********************************************************************
// Begin Template Definition
// **********************************************************************

//Define our current theme
$file = $themeurl;

// Do the template changes and echo the ready template
$template = file_get_contents($file);

$template = replace(':ARTICLETITLE:',$article_title,$template);
$template = replace(':ARTICLECONTENT:',$article_content,$template);
$template = replace(':ARTICLEDATE:',$article_date,$template);

$template = replace(':BROWSERTITLE:',$browsertitle,$template);
$template = replace(':SITENAME:',$sitename,$template);

//Define our links
$template = replace(':LINKSBAR:',$links,$template);

//Get the content for the side bar...

$sidebar = getsidebar();
$template = replace(':SIDEFEED:',$sidebar,$template);

//Get the ad content...
$template = replace(':ADS:',$ads,$template);

//Get the slogan info
$template = replace(':SLOGAN:',$slogan,$template);


echo $template;

// **********************************************************************
// End Template Definition
// **********************************************************************



?>


</body>
</html>

 

 

The fishingquiz.php, which uses iframe:

<html>
<body>

<div style="position: absolute; left: 282px; top: 175px;"> 

<iframe src ="http://www.pokemansion.net/quizpage.php" width="505" height="395">
<p>Your browser does not support iframes.</p
</iframe>

</div>
<?php

// **********************************************************************
// Rusnak PHP Adoptables Script
// Copyright 2009 Brandon Rusnak
// For help and support: http://www.rusnakweb.com/forum/
//
// Redistribution prohibited without written permission
// **********************************************************************

// Wake the sleeping giant

// **********************************************************************
// Basic Configuration Info
// **********************************************************************

include("inc/functions.php");
include("inc/config.php");
include("inc/bbcode.php");

$themeurl = grabanysetting("themeurl");

// **********************************************************************
// Define our top links by calling getlinks()
// **********************************************************************

$links = getlinks();

// **********************************************************************
// Define our ads by calling getads()
// **********************************************************************

$ads = getads("any");

// **********************************************************************
// Grab any dynamic article content from the content table
// **********************************************************************

$pagecontent = getsitecontent("");
$article_title = $pagecontent[title];
$article_content = $pagecontent[content];


// Convert the BBCODE to HTML
$article_content = bbconvert($article_content);

// Convert line breaks to <br>
$article_content = nl2br($article_content);

// **********************************************************************
// Grab any settings that we will need for the current page from the DB
// **********************************************************************

$browsertitle = grabanysetting("browsertitle");
$sitename = grabanysetting("sitename");
$slogan = grabanysetting("slogan");

// **********************************************************************
// Check and see if the user is logged in to the site
// **********************************************************************

$loginstatus = logincheck();
$isloggedin = $loginstatus[loginstatus];
$loggedinname = $loginstatus[username];

// **********************************************************************
// End Prepwork - Output the page to the user
// **********************************************************************



// **********************************************************************
// Begin Template Definition
// **********************************************************************

//Define our current theme
$file = $themeurl;

// Do the template changes and echo the ready template
$template = file_get_contents($file);

$template = replace(':ARTICLETITLE:',$article_title,$template);
$template = replace(':ARTICLECONTENT:',$article_content,$template);
$template = replace(':ARTICLEDATE:',$article_date,$template);

$template = replace(':BROWSERTITLE:',$browsertitle,$template);
$template = replace(':SITENAME:',$sitename,$template);

//Define our links
$template = replace(':LINKSBAR:',$links,$template);

//Get the content for the side bar...

$sidebar = getsidebar();
$template = replace(':SIDEFEED:',$sidebar,$template);

//Get the ad content...
$template = replace(':ADS:',$ads,$template);

//Get the slogan info
$template = replace(':SLOGAN:',$slogan,$template);


echo $template;

// **********************************************************************
// End Template Definition
// **********************************************************************



?>

</body>
</html>

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.