PDA

View Full Version : co-branding

gubbs
Jul-27-2004, 03:04 AM
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
Jul-27-2004, 07:01 AM
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
Jul-27-2004, 10:25 AM
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[i]].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
Jul-27-2004, 10:43 AM
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