Topic: flickr: can't align thumbs top left & no scrolling happening
I would kill for some help. I'm building a site for someone and they want simpleviewer, (they don't want to pay for the upgrade,) and it would be best, pretty much a must, for it to work with flickr. I've NEVER used this script before and was surprised at how awesomely easy it was... until I started going absolutely insane with these two problems...
1. I don't want the thumbnails centered on the left, I want them at the top of the left. (see pics below)
2. Most importantly it's cutting off the image descriptions even though I believe I have everything set to either 100% or scroll="auto" (etc...)
This is what it looks like (screen cap):
http://melorasworld.com/photoalbum/albu … cutoff.jpg
This is more like what I would hope that it would do (screen cap):
http://melorasworld.com/photoalbum/albu … i_want.jpg
This is the live version: the coding for the whole site isn't finished so it is likely that the links won't take you to the right places yet but, this is the page with the "working" code:
http://melorasworld.com/crap/site_luisa … llery.html
See how short the description is on the live page? You can tell how cut off it is because the description should read like this:
Blah blah blah, might as well test this out. Blah and blah-de-dah more more more more more....more.... Blah blah blah, might as well test this out. Blah and blah-de-dah more more more more more more Blah blah blah, might as well test this out. Blah and blah-de-dah more more more more more more
It doesn't need a scrollbar, but the flash isn't extending downward to accommodate the image description.
Here's my code in the gallery's folder:
gallery.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Luisa Rafidi</title>
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="../style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.galleryURL = "gallery.xml";
var params = {};
params.bgcolor = "";
params.allowfullscreen = true;
params.allowscriptaccess = "always";
var params={};
params.wmode="transparent";
swfobject.embedSWF("simpleviewer.swf", "flashContent", "700", "600", "9.0.10", false, flashvars, params);
</script>
</head>
<body onload="MM_preloadImages('../layout_1b.jpg','../layout_6b.jpg','../layout_2b.jpg','../layout_3b.jpg','../layout_4b.jpg')">
<div id="main" style="position:absolute; width:900px; z-index:1; left: 0px; top: 0px; overflow: hidden; visibility: visible;">
<table width="900" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="900" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="165" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="165"><a href="../gallery.html" target="_parent" onmouseover="MM_swapImage('Gallery','','../layout_1b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="../layout_1a.jpg" alt="Gallery" name="Gallery" width="165" height="111" border="0" id="Gallery" /></a></td>
</tr>
<tr>
<td><a href="../info.html" target="_parent" onmouseover="MM_swapImage('Info','','../layout_6b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="../layout_6a.jpg" alt="Info" name="Info" width="165" height="111" border="0" id="Info" /></a></td>
</tr>
</table></td>
<td><table width="735" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="735" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="137"><a href="../other.html" target="_parent" onmouseover="MM_swapImage('Other','','../layout_2b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="../layout_2a.jpg" alt="Other" name="Other" width="137" height="159" border="0" id="Other" /></a></td>
<td width="97"><a href="../links.html" target="_parent" onmouseover="MM_swapImage('Links','','../layout_3b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="../layout_3a.jpg" alt="Links" name="Links" width="97" height="159" border="0" id="Links" /></a></td>
<td width="80"><a href="../index.html" target="_parent" onmouseover="MM_swapImage('Home','','../layout_4b.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="../layout_4a.jpg" alt="Home" name="Home" width="80" height="159" border="0" id="Home" /></a></td>
<td width="421"><img src="../layout_5.jpg" width="421" height="159" /></td>
</tr>
</table></td>
</tr>
<tr>
<td height="63" valign="bottom" background="../layout_7_gallery.jpg"><img src="../layout_spacer.gif" width="70" height="10" border="0" />• Original Art •Fan Art • Commissions • Rough Work...</td>
</tr>
</table></td>
</tr>
</table> </td>
</tr>
<tr>
<td height="650" valign="top" background="../layout_bg_gallery.jpg"><div id="flashContent">SimpleViewer requires JavaScript and the Flash Player.
<a href="http://www.adobe.com/go/getflashplayer/">Get Flash.</a></div></td>
</tr>
</table>
</div>
</body>
</html>gallery.xml
<?xml version="1.0" encoding="UTF-8"?>
<simpleviewergallery
galleryStyle="classic"
title="SimpleViewer Gallery"
textColor="52b384"
frameColor="52b384"
frameWidth="3"
thumbPosition="LEFT"
thumbColumns="3"
thumbRows="3"
showOpenButton="TRUE"
showFullscreenButton="TRUE"
maxImageWidth="500"
maxImageHeight="500"
useFlickr="true"
flickrUserName="melorasworld"
flickrTags=""
languageCode="AUTO"
languageList=""
imagePath="images/"
thumbPath="thumbs/"
vAlign="top"
>
</simpleviewergallery>index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SimpleViewer Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.galleryURL = "gallery.xml";
var params = {};
params.allowfullscreen = true;
params.allowscriptaccess = "always";
params.bgcolor = "222222";
swfobject.embedSWF("simpleviewer.swf", "flashContent", "100%", "100%", "9.0.124", false, flashvars, params);
</script>
<style type="text/css" media="screen">
html, body { height:100%; }
body {
margin:0;
padding:0;
overflow:auto;
color:#52b384;
font-family:"Courier New", Courier, monospace;
font-size:14px;
background-image: url(../layout_bg.jpg);
}
a {
color:#ff0000;
}
.flashContent {
background-repeat: no-repeat;
background-image: url(../layout_bg_gallery.jpg);
height: auto;
max-height: 100%;
max-width: 100%;
overflow: auto;
vertical-align: top;
}
</style>
</head><body><div class="flashContent" id="flashContent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://get.adobe.com/flashplayer/">Get Flash</a></div>
</body>
</html>I need to deliver this site to them, this is the only thing holding me up, (I can't believe I can't figure this out, I've spent hours frustrated) so any help would be so extremely appreciated! (thank you thank you, I hope)