PDA

View Full Version : How do I get this frame to work?

jeffu
Feb-20-2007, 02:50 PM
I've created a frame for my slideshow - I'm sure it's the wrong dimensions right now, but I just want to see how it looks. So far I haven't been able to get it to work. The frame is a transparent PNG.

I have this code in my CSS per the thread I found about this:

#MYframe {
background: url(http://photography.jeffulrich.com/photos/131014763-O.jpg) no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src='http://photography.jeffulrich.com/photos/131014763-O.jpg');
width: 644px;
height: 444px;
position: relative;
_left: 20px;
margin: 0px auto;
z-index: 13;
text-align: center;
}

Where do I put this code:

HTML: <div id="MYframe"></div> this goes where you have your slideshow div.

I've tried the HTML code in all the boxes - footer, body, css, java - doesn't seem to do anything. I know I'm missing something.

Thanks!
jeffu
Feb-20-2007, 07:09 PM
Anyone have any ideas???

I've created a frame for my slideshow - I'm sure it's the wrong dimensions right now, but I just want to see how it looks. So far I haven't been able to get it to work. The frame is a transparent PNG.

I have this code in my CSS per the thread I found about this:

#MYframe {
background: url(http://photography.jeffulrich.com/photos/131014763-O.jpg) no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src='http://photography.jeffulrich.com/photos/131014763-O.jpg');
width: 644px;
height: 444px;
position: relative;
_left: 20px;
margin: 0px auto;
z-index: 13;
text-align: center;
}

Where do I put this code:

HTML: <div id="MYframe"></div> this goes where you have your slideshow div.

I've tried the HTML code in all the boxes - footer, body, css, java - doesn't seem to do anything. I know I'm missing something.

Thanks!
Andy
Feb-20-2007, 07:10 PM
Anyone have any ideas???
Sure but hang in there okay? It's rather advanced, and therefore a bit harder than the average stuff. I'd do it right now but I'm traveling. Keep bumping it, 1x a day, and we'll be sure we get the help you need!
jeffu
Feb-21-2007, 11:06 AM
Sure but hang in there okay? It's rather advanced, and therefore a bit harder than the average stuff. I'd do it right now but I'm traveling. Keep bumping it, 1x a day, and we'll be sure we get the help you need!

Thanks, I think I'm getting most of it - I now have the frame showing up -

take a look at jeffulrich.smugmug.com

My question now is about spacing and how do I get the frame on top?

It looks like it's always behind the slideshow - the one on Andy's site appears to be on top.

Thanks!
Allen
Feb-21-2007, 11:44 AM
Thanks, I think I'm getting most of it - I now have the frame showing up -

take a look at jeffulrich.smugmug.com

My question now is about spacing and how do I get the frame on top?

It looks like it's always behind the slideshow - the one on Andy's site appears to be on top.

Thanks!
I can't get the frame to the top.
Food for thought.
Might have something to do with you've named your slideshow container
MYframe. The show is in your biobox so why not use bioBox for the
container and then place the frame over it?
jeffu
Feb-21-2007, 12:24 PM
I can't get the frame to the top.
Food for thought.
Might have something to do with you've named your slideshow container
MYframe. The show is in your biobox so why not use bioBox for the
container and then place the frame over it?

Sounds logical - but I've tried and I must be missing something - if I name the container bioBox - then I just get the slideshow, how to I get the frame over it?
Allen
Feb-21-2007, 12:33 PM
Sounds logical - but I've tried and I must be missing something - if I name the container bioBox - then I just get the slideshow, how to I get the frame over it?
You could name your container mySlideshow.
Then add this to your bio.
<html>
<div id="mySlideshow"></div>
<div id="MYframe"></div>
</hrml>

This would then give two separate div's to align.
jeffu
Feb-21-2007, 12:51 PM
You could name your container mySlideshow.
Then add this to your bio.
<html>
<div id="mySlideshow"></div>
<div id="MYframe"></div>
</hrml>

This would then give two separate div's to align.

That's starting to get it - now were do I put the alignments? In the bio with the devs?
Allen
Feb-21-2007, 12:52 PM
I got the frame on top playing with the following.

Replace this
/*span class="dropcap"&gt;*/
with
<div id="MYframe"></div>
in your header code.

#ssSlide {
position: relative !important;
top: -480px;
left: 5px ;
z-index:10;
height: 450px;
width: 650px;
/* border: 7px ridge #000000; */
/* margin-bottom: -10px; */
/*margin-top: 10px; */
}


#MYframe {
background: url(http://jeffulrich.smugmug.com/photos/131200870-O.png) no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src='http://jeffulrich.smugmug.com/photos/131200870-O.png');
width: 600px;
height: 470px;
position: relative;
_left: 0px;
margin: 0px auto;
margin-bottom: 0px;
margin-top: 20px;
z-index: 99;
text-align: center;
}
Allen
Feb-21-2007, 12:57 PM
One problem is the different size photos, esp. the portraits. Can only center
them with space on either side. You could in your slideshow footer set the
sizes to fit your frame. Maybe a few pixels bigger then the inside of the frame.

If you used only landscapes it would be perfect. Maybe create a private
gallery for the show source with only landscapes.
Allen
Feb-21-2007, 01:15 PM
This is what I have so far.

#userBio {
position: relative !important;
left: 50px;
height: 500px;
text-align: center;
margin: 0 auto;
margin-bottom: -125px;
margin-top: -30px;
}

#MYframe {
z-index: 99;
position: relative !important;
top: -475px;
left: 6px;
background: url(http://jeffulrich.smugmug.com/photos/131200870-O.png) no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image src='http://jeffulrich.smugmug.com/photos/131200870-O.png');
width: 600px;
height: 470px;
}

/* gets rid of extra space above and below slideshow */

#ssSlide {
position: relative !important;
z-index: 10;
left: -50px;
height: 450px;
width: 600px;
mar gin-bottom: -10px;
mar gin-top: 10px;
marg in-left: -80px;
margin: 0 auto;
}
Allen
Feb-21-2007, 01:19 PM
One problem is the different size photos, esp. the portraits. Can only center
them with space on either side. You could in your slideshow footer set the
sizes to fit your frame. Maybe a few pixels bigger then the inside of the frame.

If you used only landscapes it would be perfect. Maybe create a private
gallery for the show source with only landscapes.
This is what I think would be the best thing to so. Create a private gallery for
the show with all photos landscape and same size.
jeffu
Feb-21-2007, 01:20 PM
One problem is the different size photos, esp. the portraits. Can only center
them with space on either side. You could in your slideshow footer set the
sizes to fit your frame. Maybe a few pixels bigger then the inside of the frame.

If you used only landscapes it would be perfect. Maybe create a private
gallery for the show source with only landscapes.

Thanks a bunch - that was working until I signed out and tried to pull it up in IE 7 - now I just get two blank frames
Allen
Feb-21-2007, 01:27 PM
Thanks a bunch - that was working until I signed out and tried to pull it up in IE 7 - now I just get two blank frames Did you paste it in and get the below without the *'s
Viewing in here the : D shows as a smiley if there's not a space or * between them.
Try pasting in and removing the *'s


_filter: progid*:*DXImageTra


You have two frames, remove the one from the bio.
jeffu
Feb-22-2007, 04:53 AM
Did you paste it in and get the below without the *'s
Viewing in here the : D shows as a smiley if there's not a space or * between them.
Try pasting in and removing the *'s


_filter: progid*:*DXImageTra


You have two frames, remove the one from the bio.

Ok - I appreciate all the help - but this is just not working. If you go back to the orignal post, I followed what was taken from another thread - didn't work. I pasted all the code from above and it works in FF - in IE7 however, I just get a frame at the top over my banner and no slideshow. This is really frustrating, I've spent 3 days on this and it shouldn't be that hard to do.

Any other ideas?

I keep playing with it and trying every variation, but no luck.
jeffu
Feb-23-2007, 03:00 PM
I've finally been able to get it to all line up - and I think it looks great!

Thanks for all the help. I had to go back and read through this very carefully to get it to all show up ok.

Can someone check and see if it works on IE6?

Thanks!

photography.jeffulrich.com
Allen
Feb-23-2007, 07:05 PM
I've finally been able to get it to all line up - and I think it looks great!

Thanks for all the help. I had to go back and read through this very carefully to get it to all show up ok.

Can someone check and see if it works on IE6?

Thanks!

photography.jeffulrich.com
Your page is 3248763084604px tall in IE6.:D It scrolls down forever. Have no
idea what's causing this.