Jump to content

Mixing CSS and PHP

Mouse

By Mouse
in PHP Coding Help

 Share

Recommended Posts

Mouse Member

Mouse

Posted
Posted
Hello all....

this is going to be so obviouse but i just cant see it....

this works...

[code]
<style type="text/css">
#menu {position:relative; top:10px; left:100px; width:75px; background-color:#fff; z-index:100;}
#menu a.p1, #menu a.p1:visited {display:block; width:75px; height:75px; text-decoration:none; background:#fff; top:0; left:0; border:0;}
#menu a img {border:0;}
#menu a.p1:hover {text-decoration:none; background-color:#8c97a3; color:#000;}
#menu a .large {display:block; position:absolute; width:1px; height:1px; border:0px; top:-1px; left:-1px;}
#menu a.p1:hover .large {display:block; position:absolute; top:-60px; left:150px; width:300px; height:300px; border:10px solid #fff;}
#info {z-index:100; height:10em;}
</style>
</head>

<body>

<div id="menu">
<a class="p1" href="#nogo" title="thumbnail image"><img src="images/mugs/img1.jpg" title="Thumbnail image" alt="Thumbnail image" /><img class="large"  src="images/mugs/img1.jpg" title="Enlarged view of image" alt="Enlarged view of image" /></a>
</div>
</body>
</html>
[/code]

but this don't....

[code]
<?php
      $filename = "images/mugs/".$familyname."_".$firstname.".jpg";
      $filename = strtolower($filename);
      
      if (file_exists($filename)) {
      echo "<!-- looking for image: $filename -->\n";
      
echo '<div id="menu">';
echo '<a class="p1" href="#nogo" ><img src=\"$filename\" /><img class="large"  src=\"$filename\" /></a>';
echo '</div>';

      } else {
      echo "<!-- looking for filename: $filename -->\n";
      echo "<img src=\"images/mugs/MugDefault.jpg\" width=\"135\" height=\"150\" >";
      }
      ?>
[/code]

WHY????????

please help me here before i tear my hair out (i don't look good without my foppish hair style...)

Mouse
Link to comment
Share on other sites
fusionpixel Member

fusionpixel

Posted
Posted
Close but no quite there yet ;)

[code]
<?php
      $filename = "images/mugs/".$familyname."_".$firstname.".jpg";
      $filename = strtolower($filename);
      
      if (file_exists($filename)) {
        echo "<!-- looking for image: $filename -->\n";
        echo '<div id="menu">';
        echo '<a class="p1" href="#nogo" ><img src="'.$filename.'" /><img class="large"  src="'.$filename.'" /></a>';
        echo '</div>';
      } else {
      echo "<!-- looking for filename: $filename -->\n";
      echo "<img src=\"images/mugs/MugDefault.jpg\" width=\"135\" height=\"150\" >";
      }
?>
[/code]

You need to get those variables out of the quotes.
Link to comment
Share on other sites
Mouse Member

Mouse

Posted
  • Author
Posted
[!--quoteo(post=355708:date=Mar 16 2006, 10:45 PM:name=fusionpixel)--][div class=\'quotetop\']QUOTE(fusionpixel @ Mar 16 2006, 10:45 PM) [snapback]355708[/snapback][/div][div class=\'quotemain\'][!--quotec--]
Close but no quite there yet ;)

[code]
<?php
      $filename = "images/mugs/".$familyname."_".$firstname.".jpg";
      $filename = strtolower($filename);
      
      if (file_exists($filename)) {
        echo "<!-- looking for image: $filename -->\n";
        echo '<div id="menu">';
        echo '<a class="p1" href="#nogo" ><img src="'.$filename.'" /><img class="large"  src="'.$filename.'" /></a>';
        echo '</div>';
      } else {
      echo "<!-- looking for filename: $filename -->\n";
      echo "<img src=\"images/mugs/MugDefault.jpg\" width=\"135\" height=\"150\" >";
      }
?>
[/code]

You need to get those variables out of the quotes.
[/quote]


now i just get two images just the same.. no image enlargement on mouseover.... :( GRRRRR bed time... come back tommorrow with clear head....

Thanks for the assist tho fusionpixel

Mouse
Link to comment
Share on other sites
fusionpixel Member

fusionpixel

Posted
Posted
[!--quoteo(post=355714:date=Mar 16 2006, 05:07 PM:name=Mouse)--][div class=\'quotetop\']QUOTE(Mouse @ Mar 16 2006, 05:07 PM) [snapback]355714[/snapback][/div][div class=\'quotemain\'][!--quotec--]
now i just get two images just the same.. no image enlargement on mouseover.... :( GRRRRR bed time... come back tommorrow with clear head....

Thanks for the assist tho fusionpixel

Mouse
[/quote]

yup, you will get 2 identical images because that is what you are telling PHP to do:

[code]echo '<a class="p1" href="#nogo" ><img src="'.$filename.'" /><img class="large"  src="'.$filename.'" /></a>';
[/code]

see? $filename is used twice in there.

hope that helps and have a good nite LOL
Link to comment
Share on other sites
Mouse Member

Mouse

Posted
  • Author
Posted
[!--quoteo(post=355717:date=Mar 16 2006, 11:14 PM:name=fusionpixel)--][div class=\'quotetop\']QUOTE(fusionpixel @ Mar 16 2006, 11:14 PM) [snapback]355717[/snapback][/div][div class=\'quotemain\'][!--quotec--]
yup, you will get 2 identical images because that is what you are telling PHP to do:

[code]echo '<a class="p1" href="#nogo" ><img src="'.$filename.'" /><img class="large"  src="'.$filename.'" /></a>';
[/code]

see? $filename is used twice in there.

[/quote]

Morning.... yawn!

right, yes the file name is used twice, just as it is in the first code example... the css should work like the example here... [a href=\"http://www.cssplay.co.uk/menu/magnify.html\" target=\"_blank\"][CSS Example][/a]
Link to comment
Share on other sites
fusionpixel Member

fusionpixel

Posted
Posted
Good morning...

this works for me:
[code]
<style type="text/css">
#menu {position:relative; top:10px; left:100px; width:75px; background-color:#fff; z-index:100;}
#menu a.p1, #menu a.p1:visited {display:block; width:75px; height:75px; text-decoration:none; background:#fff; top:0; left:0; border:0;}
#menu a img {border:0;}
#menu a.p1:hover {text-decoration:none; background-color:#8c97a3; color:#000;}
#menu a .large {display:block; position:absolute; width:1px; height:1px; border:0px; top:-1px; left:-1px;}
#menu a.p1:hover .large {display:block; position:absolute; top:-60px; left:150px; width:300px; height:300px; border:10px solid #fff;}
#info {z-index:100; height:10em;}
</style>
</head>

<body>
<?
echo "<!-- looking for image: $filename -->\n";
      
echo '<div id="menu">';
echo '<a class="p1" href="#nogo" ><img src=\"$filename\" /><img class="large"  src=\"$filename\" /></a>';
echo '</div>';
?>
</body>
</html>[/code]

now its my turn :) Yawn! nite...
Link to comment
Share on other sites
Mouse Member

Mouse

Posted
  • Author
Posted
[!--quoteo(post=355855:date=Mar 17 2006, 07:04 AM:name=fusionpixel)--][div class=\'quotetop\']QUOTE(fusionpixel @ Mar 17 2006, 07:04 AM) [snapback]355855[/snapback][/div][div class=\'quotemain\'][!--quotec--]
now its my turn :) Yawn! nite...
[/quote]

nite nite, sleep tight, hope the bed bugs don't bite.... and many thanks!!!

Mouse
Link to comment
Share on other sites
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.