co-branding

gubbs · July 27, 2004

Ive tried a few things in the Header & Footer sections but could someone give me an idea of the type of things that can be done (and how to do it) using the "body tag", "javascript HTML" and "stylesheet HTML" sections on the co-branding page for a power user
Thanks

gubbs

dkapp · July 27, 2004

gubbs wrote:

Ive tried a few things in the Header & Footer sections but could someone give me an idea of the type of things that can be done (and how to do it) using the "body tag", "javascript HTML" and "stylesheet HTML" sections on the co-branding page for a power user
Thanks

gubbs

I'd like to know myself. I've got the basic header & Footer, and didn't go past that.

Thanks in advance.
Dave

Baldy · July 27, 2004

Maybe the best way to answer is to show an example.

If you go to www.emphoto.com, you can see how onethumb integrated smugmug with a standard website for his wife's photography business.

When you click on portfolio, it takes you to emphoto.smugmug.com and it's an easy transition for users because the only thing that changes is the URL.

To match her color choices and the buttons that highlight as you roll over them, etc., onethumb used some style sheet elements and javascript.

Here's the body tag:

<body bgcolor="#FFFFFF" text="#000000" link="#502222" vlink="#9C9C9C" alink="#9C9C9C" marginwidth=10 marginheight=10>

Here's the stylesheet html:

body {
background: #FFFFFF;
color: #000000;
margin: 10px;
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: small;
}

div, p, th, td, li, dd, textarea {
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: small;
}
li {
color: #502222;
}
.copy {
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: small;
color: #000000;
}

/* page elements */
.smborderdown {
border: thin solid #502222;
}
.smborder {
border: thin solid #502222;
}
.sepdot {
color: #502222;
font-family : Arial, Helvetica, Verdana, sans-serif;
font-size : 20px;
font-style : normal;
}

/* colors */
.black {
color: #000000;
}
.blackbg {
background-color: #000000 ;
}
.white {
color: #ffffff;
}
.whitebg {
background-bcolor: #ffffff;
}
.gray {
color: #9C9C9C;
}
.graybg {
background-color: #9C9C9C;
}
.wine {
color: #502222;
}
.winebg {
background-color: #502222 ;
}

And here's the javascript:

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}
function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments].src = changeImages.arguments[i+1];
}
}
}
var preloadFlag = false;
function preloadImages() {
if (document.images) {

//preload footer nav
portfolio_over = newImage("http://www.emphoto.com/img/footer/portfolio.gif");
pricing_over = newImage("http://www.emphoto.com/img/footer/pricing.gif");
biography_over = newImage("http://www.emphoto.com/img/footer/biography.gif");

preloadFlag = true;
}
}

Clear as mud?

dkapp · July 27, 2004

Baldy wrote:

Clear as mud?

Yup. Mine is staying the way it is

This other stuff is out of my league. Maybe this will be a nice goal for the future.

Thanks for the example.

-Dave

co-branding

Comments