Issue with Lightbox Gallery
Hello,
This should hopefully be a minor problem, I just can't figure it out.
I have a lightbox gallery set up, and it works perfectly except once clicked on, underneath the image it has this large white space area underneath it which contains the 'prev,' and 'next' buttons.
Could anyone possibly look at my website/coding to see if I've made a newbie mistake here?
Any help at all would be hugely appreciated!
Cheers!
My site:
http://www.paulricedesign.com/photo.html
As a newbie you have done very well so keep it up. Just keep working on it and read widely about web designs and keep visiting people's sites to get new ideas.
Good luck.
Similar Messages
-
Help with lightbox gallery widget
Hello
I built a website for my photography business and used the lightbox gallery widget. I'm not massively HTML minded so I tend to build in design view and just tweak the HTML code.
The gallery is here: http://www.emmarichards.co.uk/gallery.html
When you click on one of the photos, it is not working properly, it just takes you to another webpage with just the image. It worked fine in the live view. I'm looking at it in IE, not sure which version but a fairly up to date one I think. I've also checked it using the Mozilla browser and having the same problem. How can I rectify this please? The pages code is as follows:
<!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>Barnsley Wedding Photographer - Emma Richards</title>
<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #4E5869;
margin: 0;
padding: 0;
color: #000;
background-color: #99BADB;
/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
padding: 0;
margin: 0;
h1, h2, h3, h4, h5, h6, p {
margin-top: 0; /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
padding-right: 15px;
padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
border: none;
/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
color:#414958;
text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
a:visited {
color: #4E5869;
text-decoration: underline;
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
text-decoration: none;
background-color: #FFFFFF;
/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.container {
width: 80%;
max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
background: #FFF;
margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
/* ~~the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo~~ */
.header {
background-color: #ffffff;
/* ~~ This is the layout information. ~~
1) Padding is only placed on the top and/or bottom of the div. The elements within this div have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
.content {
padding: 10px 0;
/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol {
padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
/* ~~ The footer ~~ */
.footer {
padding: 10px 0;
background-color: #ffffff;
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
float: left;
margin-right: 8px;
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
body,td,th {
font-family: Tahoma, Geneva, sans-serif;
-->
</style>
<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="scripts/lightbox.js" type="text/javascript"></script>
<link href="css/lightbox.css" rel="stylesheet" type="text/css" />
<link href="css/sample_lightbox_layout.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* BeginOAWidget_Instance_2127022: #gallery */
.lbGallery {
/*gallery container settings*/
background-color: #ffffff;
padding-left: 180px;
padding-top: 20px;
padding-right: 180px;
padding-bottom: 20px;
width: 900px;
height: auto;
text-align:center;
.lbGallery ul { list-style: none; margin:0;padding:0; }
.lbGallery ul li { display: inline;margin:0;padding:0; }
.lbGallery ul li a{text-decoration:none;}
.lbGallery ul li a img {
/*border color, width and margin for the images*/
border-color: #ffffff;
border-left-width: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
margin-left:5px;
margin-right:5px;
margin-top:5px;
margin-bottom:5px:
.lbGallery ul li a:hover img {
/*background color on hover*/
border-color: #ffffff;
border-left-width: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
#lightbox-container-image-box {
border-top: 0px none #ffffff;
border-right: 0px none #ffffff;
border-bottom: 0px none #ffffff;
border-left: 0px none #ffffff;
#lightbox-container-image-data-box {
border-top: 0px;
border-right: 0px none #ffffff;
border-bottom: 0px none #ffffff;
border-left: 0px none #ffffff;
/* EndOAWidget_Instance_2127022 */
</style>
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2127022" binding="#gallery" />
</oa:widgets>
-->
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#000000" vlink="#000000" alink="#000000">
<div class="container">
<div class="header">
<div align="center">
<p><img src="1title 2.png" alt="emma richards barnsley wedding photographer" width="1144" height="368" /></p>
<p><a href="about.html"><img src="1.png" alt="about emma richards barnsley wedding photographer" width="143" height="46" border="0" /></a><a href="weddings.html"><img src="1.weddings.png" alt="weddings information barnsley photographer" width="162" height="46" border="0" /></a><a href="gallery.html"><img src="1.gallery.png" alt="barnsley wedding photographer image gallery" width="162" height="46" border="0" /></a><a href="pricing.html"><img src="1.pricing.png" alt="barnsley wedding photographer pricing information" width="162" height="46" border="0" /></a><a href="engagements.html"><img src="1.engage.png" alt="engagement photography couples shoot barnsley" width="221" height="46" border="0" /></a><a href="http://emmarichardsuk.blogspot.com"><img src="1 blgo.png" alt="emma richards wedding photography blog" width="105" height="45" border="0" /></a><a href="contact.html"><img src="1 contact.png" alt="contact emma richards" width="162" height="46" border="0" /></a></p>
</div>
<!-- end .header --></div>
<div class="content">
<div id="gallery" class="lbGallery">
<div align="center">
<ul>
<li> <a href="2.ABBIE AND KID.jpg" width="600" height="400" title=""><img src="2.ABBIE AND KID.jpg" width="150" height="100" alt="barnsley wedding photography" /></a>
<li> <a href="2.R AND M CUTTING CAKE.jpg" title=""><img src="2.R AND M CUTTING CAKE.jpg" width="150" height="100" alt="Park Inn wedding" "wath" "barnsley" "photography" /></a>
<li> <a href="alex laura 1 (5).jpg" title=""><img src="alex laura 1 (5).jpg" width="150" height="100" alt="barnsley wedding photographer" /></a>
<li> <a href="alex laura 1 (8).jpg"><img src="alex laura 1 (8).jpg" width="150" height="100" alt="whitley hall wedding" "sheffield" "barnsley wedding photographer" "reception" /></a> </li>
<li> <a href="tree closer.jpg" width="600px" height="400px" title=""><img src="tree closer.jpg" width="150" height="100" alt="" /></a> </li><br />
<li> <a href="11.jpg" width="600" height="400" title=""><img src="11.jpg" width="150" height="100" alt="barnsley wedding photography" /></a>
<li> <a href="10.jpg" title=""><img src="10.jpg" width="150" height="100" alt="barnsley wedding photography" /></a>
<li> <a href="James Ruth Church128.jpg" title=""><img src="James Ruth Church128.jpg" width="150" height="100" alt="whitley hall wedding" "sheffield" "barnsley wedding photographer" "reception" /></a>
<li> <a href="2.ABBIE GROUP.jpg"><img src="2.ABBIE GROUP.jpg" width="150" height="100" alt="barnsley wedding photographer" /></a> </li>
<li> <a href="12-5.jpg" width="600px" height="400px" title=""><img src="12-5.jpg" width="150" height="100" alt="barnsley wedding photography" /></a> </li><br />
<li> <a href="alex laura 1 (3).jpg" width="600" height="400" title=""><img src="alex laura 1 (3).jpg" width="150" height="100" alt="barnsley wedding photography" /></a>
<li> <a href="confetti crop.jpg" title=""><img src="confetti crop.jpg" width="150" height="100" alt="barnsley wedding photographer" /></a>
<li> <a href="Mark & Rachel 025.jpg" title=""><img src="Mark & Rachel 025.jpg" width="150" height="100" alt="park inn wedding" "wath" "barnsley" "photography" /></a>
<li> <a href="Abbie Ben 0336.jpg"><img src="Abbie Ben 0336.jpg" width="150" height="100" alt="barnsley wedding photographer" /></a> </li>
<li> <a href="Abbie Ben 0309.jpg" width="600px" height="400px" title=""><img src="Abbie Ben 0309.jpg" width="150" height="100" alt="barnsley wedding photographer" "first kiss" /></a> </li><br />
<li> <a href="laughing 2.png" width="600" height="400" title=""><img src="laughing 2.png" width="150" height="100" alt="whitley hall wedding" "sheffield wedding photography" /></a>
<li> <a href="2.double.jpg" title=""><img src="2.double.jpg" width="150" height="100" alt="Park Inn wedding" "wath" "barnsley" "photography" /></a>
<li> <a href="132.jpg" title=""><img src="132.jpg" width="150" height="100" alt="whitley hall wedding" "sheffield" "barnsley wedding photographer" "reception" /></a>
<li> <a href="Abbie and Ben 0621.jpg"><img src="Abbie and Ben 0621.jpg" width="150" height="100" alt="barnsley wedding photography" /></a> </li>
<li> <a href="Abbie Ben 0320.jpg" width="600px" height="400px" title=""><img src="Abbie Ben 0320.jpg" width="150" height="100" alt="barnsley wedding photography" /></a> </li><br />
<li> <a href="Abbie Ben 0011 copy.jpg" width="600" height="400" title=""><img src="Abbie Ben 0011 copy.jpg" width="150" height="100" alt="bouquet" "barnsley wedding photographer" /></a>
<li> <a href="James & Ruth0202.jpg" title=""><img src="James & Ruth0202.jpg" width="150" height="100" alt="barnsley wedding photographer" /></a>
<li> <a href="alex laura 1 (4).jpg" title=""><img src="alex laura 1 (4).jpg" width="150" height="100" alt="barnsley wedding photographer" /></a>
<li> <a href="123.jpg"><img src="123.jpg" width="150" height="100" alt="rotherham" "park inn wedding" "wath" "barnsley" "photography" /></a> </li>
<li> <a href="Mark & Rachel 311.jpg" width="600px" height="400px" title=""><img src="Mark & Rachel 311.jpg" width="150" height="100" alt= "rotherham" "Park Inn wedding" "wath" "barnsley" "photography" /></a> </li><br />
</ul>
</div>
</div>
<div align="center">
<script type="text/javascript">
// BeginOAWidget_Instance_2127022: #gallery
$(function(){
$('#gallery a').lightBox({
imageLoading: '/images/lightbox/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
imageBtnPrev: '/images/lightbox/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
imageBtnNext: '/images/lightbox/lightbox-btn-next.gif', // (string) Path and the name of the next button image
imageBtnClose: '/images/lightbox/lightbox-btn-close.gif', // (string) Path and the name of the close btn
imageBlank: '/images/lightbox/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
fixedNavigation: false, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
containerResizeSpeed: 400, // Specify the resize duration of container image. These number are miliseconds. 400 is default.
overlayBgColor: "#ffffff", // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.
overlayOpacity: 0, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9
txtImage: 'Image', //Default text of image
txtOf: 'of'
// EndOAWidget_Instance_2127022
</script><!-- end .content --></div>
</div>
<div class="footer">
<hr />
<p align="right" class="container">07794 430 229 // [email protected]</p>
<!-- end .footer --></div>
<!-- end .container --></div>
</body>
</html>emmarichards4 wrote:
Do I need to have the same path as in my root folder, so for example within my Public folder with my host, have a 'script's folder and then put the 'jquery.js' file within that or should that not matter?
All paths (the route from the parent file to the dependent file) are crucial.
If the path is not correct, the required file will not be found and the effect will not work.
There's no need to upload files individually and manually place them into remote folders. DW handles all file and folder paths for you if you use the Files panel.
For example, http://www.emmarichards.co.uk/scripts/lightbox.js = 404 error. The file still does not exist on the server in that location.
You should be able to click on the css and scripts folders locally, click Put and all files in those folders will be uploaded correctly. -
Problem with lightbox gallery widget!
Hi I'm using the lightbox gallery in conjuction with the css only menu and the psry content slideshow.
I simply cannot get the lightbox to work, it opens up the images in a new page.
www.studio-88.co.za
Please help anyone!Hi Scott
Thank you so much for taking the time to look at my site.
about half an hour after i posted I realised there was a case-sensitive error reffering to the pictures in the javascript...
Wnated to delete the post however couldnt as my internet went offline.
If you could help me with another issue though.
As you can see the light box is currently set as a marquee on the page (<marquee><div> _lightbox </div></marquee>
is it possible to get the images scrolling on one line? -
Issues with spry gallery in a DW template
Hi all,
I have incorporated a spry gallery I originally found at:
http://www.adobe.com/devnet/dreamweaver/articles/spry_photo_album_02.html
into my page. This works fine until I save my page as a template.The js seems to dissapear leaving the gallery area blank. The rest of the page is fine.
I understand this tutorial was written for v8 but have no idea why it wont work in a CS4 template.
I even tested the tutorial html by creating a new site and coverting the html file into a template. Gallery doesnt work.
Any help on this would be awesome as the gallery area was to be a main feature on the home page.
Cheers.Make the link to the Flash element ROOT relative.
That way, the link doesn't need to be managed and will work
just fine in
your Template child pages.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"buckeyestargazer" <[email protected]> wrote
in message
news:gbreos$cpq$[email protected]..
> I'm relatively new to Dreamweaver (version 8) and I'm
having a problem
> inserting a flash (.swf) slideshow of pictures into a
template that then
> updates several webpages. The problem is, when I insert
the flash into
> the
> template page and the webpages get updated, the flash
animation does not
> play
> on the webpages and just has a white box. If I detach
the template from
> the
> webpage, then the flash displays correctly. But the
problem with that is
> then
> there is no point to using a template because I would
have to manually
> update
> each webpage instead of just the template when I want to
make a change to
> all
> the webpages. The problem must be with the template,
because when I try
> to
> attach the template to a very simple webpage containing
only a couple
> words and
> no other graphics, the flash will not display correctly.
Any ideas on
> what is
> wrong or how I can insert a flash slideshow into a
template so that it
> updates
> the webpages correctly?
>
> -
Hello,
I am in the process of getting a website portfolio together. Here is my issue, when I log on and go directly to the portfolio page http://www.heapwebdesign.com/portfolio.html it works fine. When I try to link to the page via the index page the slideshow does not work... Any ideas?
Thanks in advance.Hi
Move the following code to the head content of the page.
<script type="text/javascript">
// BeginWebWidget lightbox_gallery
$(function() {
$('#gallery1 a').lightBox();
// EndWebWidget lightbox_gallery
</script>
PZ -
In my gallery, the photos resize and display fine. However,
during the transition period, there is wierd overlap corruption of
the images. Instead of going immediately to the div holder's
background image, it pre-loads the selected picture, distorts it,
and then flashes the background color before morphing to the
correct picture.
Also, I have links as my gallery listing. For some reason,
when I click on the gallery links, the associated pictures do not
load until thumbnail action is taken.
Any ideas?
Here
is the latest version of this issueKin --
Thank you for the response. I figured out a different
solution to the wierd image problem. However, I am still unable to
get the images to shift automatically when the gallery is changed.
For example, if I am viewing a vertical image under the "flowers"
gallery and then switch to the "waterfalls" gallery, the vertical
image remains until I click on one of the waterfall thumbs.
Any ideas on how to get this to go? It does it in the demo,
but I cannot figure out what I need to do with my code to enable
this. Thanks for your help, as always, with this. I really
appreciate it! -
Auto Size issue with Media Gallery .AS files
First off, thanks for taking a look!
I came across this Adobe devnet article the other day while
looking for info on creating Flash web based image galleries
here.
In summary, it's an introduction on modifying the .XML files to
personalize your galleries created with Adobe Photoshop Elements 5.
Also in this article, there is a link to download source files
including gallery templates and a working .FLA file, which is
really the point of my post.
So. I've gone through the .AS, Javascript, and .XML files
looking for variables and parameters for controlling the
stage/auto/scale of the clip. I've read through each several times
making adjustments here and there and I've been able to change most
of what I want, but for the life of me I can not seem to get
control over the scaling of the clip when the user resizes the
browser. I have been able to load the clip at a set width and
height, with a minimum width and height, but again once the user
pulls the browser out, the entire screen scales with it.
My ideal goal is to embed a modified version of the .SWF with
set dimensions into a parent .SWF. On first load everything looks
great for about half a second - until the .AS files are loaded. At
this point the size of the gallery .SWF expands to fill the width
of the host browser. Actually, it expands beyond the browser frame
but that's neither here nor there. I'll admit the amount of code is
beyond me, but I can usually pick things apart enough to butcher it
to into what I need ;P If that can't happen, then I'm perfectly
happy to stick with the HTML gallery so it's no big deal really.
I'm just curious to know if any of you have experience with this
particular file and might suggest a direction?
I'll keep digging around, but at the moment I think i've
found about all I can translate or I'm missing something horribly
obvious. If you've played with this file, I would love some
insight. If not, and you're looking for a starting point for a
flash photo gallery, then take a look at the article. The
supporting files seem a bit heavy, but maybe that's just me. =]
Thanks again!
- noel.For single sign on using NTLM on a webVPN set up, you need to ensure you configure it through the command line. Did you use the ASDM for this single sign on? To configure auto-signon for all WebVPN users to servers with IP addresses ranging from
10.1.1.0 to 10.1.1.255 using NTLM authentication, for example, enter the following
commands:
hostname(config)# webvpn
hostname(config-webvpn)# auto-signon allow ip 10.1.1.1 255.255.255.0 auth-type ntlm
http://www.cisco.com/en/US/docs/security/asa/asa71/asdm51/selected_procedures/asdmsso.html -
FireFox -- Issue with Spry Gallery
I posted this a few months ago and I was wondering if I could
get an answer.
I want to make the images in the Spry gallery fade out before
a new image fades in. In the current mode the images vanish
instantly followed by a fade-in of the next or previous image.
I have been successful in achieving this effect in IE by
removing the following lines of code in the Gallery.js file (in the
center of the SetMainImage function).
img.style.opacity = "";
img.style.filter = "";
I also changed the background-color of #mainImageOutline in
the css file to #000000 (black). I believe this also resolved the
white speck problem.
Although the fade-out does work properly in IE it does not
work in FireFox. I believe it is the result of the
Spry.Effect.getOpacity or Spry.Effect.getStyleProp functions not
being properly calibrated for Firefox.
quote:
gBehaviorsArray["mainImage"] = new
Spry.Effect.Opacity(img, Spry.Effect.getOpacity(img), 0, {
duration: 400,
In the above line of gallery.js I replaced
"Spry.Effect.getOpacity(img)" by
"1" and that triggered the desired effect for
FireFox although it of course has the habit to set the current
image's opacity to full before fading in to the next image.
Help would be greatly appreciated.
Thank you.That is because your page is currently invalid. And renders in IE quirksmode..
<base href="http://www.industrialwebsearch.com/">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
So make sure your page is valid, and the animations will go smooth in ie -
IWeb basic problems? Issue with galleries
Hi,
A while ago I posted a question about a photo gallery I was trying to display, which went something like:
"Hello,
Just finished putting together a website for my brother but having issues with the gallery. I have a portfolio page for his photos. When I'm in iweb the photo album covers scroll nicely between images and link straight to the photo gallery page. But when I put it online I click and nothing happens, as you can see here:
http://www.guycollier.com/guycollier/EdmundCollier_Theatre_Photography_My_Portfolio/Edmund_Collier_Theatre_Photography_MyPortfolio.html
Does anyone know why? This is driving me crazy. I have deleated and uploaded the sight several times from iWeb and also Filezilla and Cyberduck but have the same issues. Please help!
ps. also if anyone knows how to set the title of the page in the browser then that would be great too!"
I have finally got the time to get back to it and have been trying various options suggested by users, including deleating and rebuilding the gallery, but it still doesn't work either online or on a local hosting. It was suggested that I might have some basic iWeb problems. Any idea what these maybe and how they might be resolved?
Thanks
GuyThanks for the suggestion. I rebuilt it and without making any changes to the layout it seemed to work ok. However, when I have made some minor changes (putting a frame around the images, changing the layout slightly, removing the navigation menus) it no longer works. Any idea? Might I be deleting something by accident?
Guy -
Issues with Video Lightbox Gallery from Muse Exchange...
I've been trying to customize the Video Lightbox Gallery from the exchange, Video Gallery Lightbox | Exchange | Adobe Muse CC
I'm using embed codes from Vimeo. My first issue was that when I replace the placeholder embed code with my Vimeo code, the frame size is considerably smaller. From Vimeo it is 500x281 and in the widget it is 700x396. So I changed the frame size in my Vimeo embed and that seemed to work. Now, though, when a preview the page it plays fine in the window, but when I enter full screen and then escape from that while the video is playing to go back the smaller window, it jumps up so far up the screen it is off the page... It doesn't happen with the placeholder video and the only difference I can see is that it's from YouTube and mine is from Vimeo. I haven't change any of the settings except for the embed code. Can anyone help me with this?I wanted to add that I am using on one page design and I have multiple video galleries further down the page. What I've noticed is that no matter which thumbnail I play and enter into full screen, when I hit escape, that window jumps all the way to the top instead of staying locked to where is originated. Again, it doesn't do it with the placeholder video, only when I replace it with my embed codes from Vimeo. This is very frustrating because I am so close to finishing and this issue is holding me up. I've searched and searched and cannot find the answer... is there anyone who can help, please?
-
Image Gallery issues with Lightbox2 - please help!
Hello there,
I am using Lightbox2 image gallery. The loading.gif and close.gif aren't showing up and I think there's an issue with the path in the lightbox.js file. The loading and close gifs are located in the Images gallery so I changed the path in the lightbox.js file accordingly - I've gone through this many many times but they are still not showing up.
Can anyone please help me?
My website is: www.labellepetraie.com
Here's where I downloaded the script from: http://www.huddletogether.com/projects/lightbox2/#how
I have tried all the path combinations mentioned in their forum but to no avail. What am I doing wrong?
Thank you for any help you can offer to me.
Regards!Interesting. I've just looked at your scripts, and it would appear that you have blended two versions of lightbox2 on your page,. Is that possible? The lightbox.js file has no function called initLightbox() in it, whereas older versions do. So, try changing this:
window.onload = function(){ // use this instead of <body onload …>
MM_preloadImages('../3websites/home4.jpg','../3web sites/amenities1.jpg','../3websites/inquiry1.jpg','../3websites/rates1.jpg','../ 3websites/photos1.jpg');
initLightbox();
to this:
window.onload = function(){ // use this instead of <body onload …>
MM_preloadImages('../3websites/home4.jpg','../3web sites/amenities1.jpg','../3websites/inquiry1.jpg','../3websites/rates1.jpg','../ 3websites/photos1.jpg');
//initLightbox();
to see if that works. I think so. Turns out the initLightbox() function call that we activated by fixing the code before is no longer needed by the lightbox2 script as of v2.04! I see that it still tells you to put that function call in the body tag, but i think that is wrong (which is very weird to say, can I really be right???). If you look at the example page online you'll see that he uses this body tag:
<body>
and there are no onload's anywhere.
Let me know.
E. Michael Brandt
www.divahtml.com
www.divahtml.com/products/scripts_dreamweaver_extensions.php
Standards-compliant scripts and Dreamweaver Extensions
www.valleywebdesigns.com/vwd_Vdw.asp
JustSo PictureWindow
JustSo PhotoAlbum, et alia -
Next and previous button issue with Prettyphoto in filtered gallery
Hi there,
I'm stryggeling with a next and previous button issue with Prettyphoto in filtered gallery.
Like to have it like this: http://demohtml.templatesquare.com/think/portfolio.html#!prettyPhoto
(next and previous buttun are there as well social connection)
My problem is this: http://finca-sonrisa.bitl.nl/sonrisa_gallery.html
(social connection is there but no next and previous buttons??)
Anybody who has a solution fot this. Have tried to change the CSS, Javascript and has followed the instructions from Prettyphoto but without any succes.
Your help we muchly appriciated,
Best Regards,
Rolfbump PLEASE HELP
-
Making a simple gallery - issues with frames
Hi there,
Please help!
I'm at the end of my tether with this one.
I am a beginner with Dreamweaver and maybe I'm running before I can walk, but I thought what I am trying to make would be fairly simple. Haha!
I want to make a basic gallery, ie. you click the arrows or the thumbnail buttons and the next image appears within the page but DOESN'T reload to a whole separate page.
I managed to do this using a frameset and thumbnails - the images loaded in the main frame fine - BUT there are 2 issues with this:
1. The link to the homepage I added in the corner loads WITHIN the frameset, and so the homepage is cut off and the thumbnails are still there. I want the link to take the user OUT of the frameset and straight to the homepage (a totally different format, with no frames used) I can't find a way to put this homepage link anywhere outside of the frameset.
2. I cant centre the frameset, or have much control over the layout like I do with tables.
Could this problem be solved using tables? Or any way to solve this simply?
Thanks.
PS. I don't have fireworks, and I don't want to use a downloadable gallery as I want control over how it works/looks, also I dont think it would solve issues 1 and 2 anyway.kcoulton30 wrote:
Thanks.
PS. I don't have fireworks, and I don't want to use a downloadable gallery as I want control over how it works/looks, also I dont think it would solve issues 1 and 2 anyway.
I don't understand this comment at all. If you use a downloadable gallery you just edit the skin as you would any other HTML document and make it look like the rest of your site. And usually support communities for those products are fairly helpful for skinning. Learning to code something like this with frames for a first project is a little ambitious but it is heading in a direction that I know you are not looking to go. I have a feeling you like the interactive galleries that pop up and switch from image to image while staying on the same page.
To answer your questions:
1. You need to define the target frame with frames. By default links open within the window they are currently in. See this example: http://webdesign.about.com/od/frames/f/bl_faq4-2.htm
2. Framesets cannot be centered on a page. They are part of the overall page layout and cannot be positioned. If you need to position a frame on a particular part of a page you will need to use iframes: http://www.w3schools.com/tags/tag_iframe.asp -
Help with a weird little blue line in the bottom right corner of my lightbox gallery?
I get a weird little blue line in the bottom right corner of my lightbox gallery when viewing in Safari and Chrome. Its not there when looking in Dreamweaver or Firefox. I'm going crazy! Can anyone help?
I have added to following code to sample_lightbox_layout.css
.lbGallery a {
text-decoration: none;
That fixes the dash, which is an underline. The default style for a link is an underline and since it was not defined the tag gets the default style for the underline.
Good luck. -
I know i'm not the designer girl type, but i'm really trying my best with a website i'm needing.
Using the Lightbox gallery, i saw a boring problem that i cant fix....
The Next, Previous, close and loading buttons arent appearing
I try to verify the folder and link, but it looks ok ... Can anyone take a look for me?
Thanks^^
<!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>
<link rel="shortcut icon" href="/favicon.ico" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>FINAL FANTASY RPG - By Fernanda Parker</title>
<!-- TemplateEndEditable -->
<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
background-image: url(../Images/Layout/bg-stripes.gif);
background-repeat: repeat;
background-color: #FFFFE2;
.oneColElsCtr #container {
width: 46em;
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
.oneColElsCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
-->
</style>
<script src="../includes/jquery-1.4.2.js" type="text/javascript"></script>
<script src="../jQuery/js/jquery.jsocial.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" type="text/javascript"></script>
<script src="../js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="../Scripts/jquery.js" type="text/javascript"></script>
<script src="../Scripts/lightbox.js" type="text/javascript"></script>
<script src="../Scripts/jquery.js" type="text/javascript"></script>
<script src="../Scripts/lightbox.js" type="text/javascript"></script>
<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="../jQuery/css/style.css" rel="stylesheet" type="text/css" />
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2149023" binding="#social" />
<oa:widget wid="2102522" binding="#navigation" />
<oa:widget wid="2127022" binding="#gallery" />
<oa:widget wid="2624026" binding="#OAWidget" />
</oa:widgets>
-->
</script>
<style type="text/css">
.oneColElsCtr table tr td table {
font-family: Verdana, Geneva, sans-serif;
color: #97934A;
.oneColElsCtr table tr td table {
color: #6C5C44;
.oneColElsCtr table tr td table {
font-size: 12%;
.oneColElsCtr table tr td table {
font-size: 12px;
.oneColElsCtr table tr td table tr th table tbody tr td img {
text-align: center;
#apDiv1 {
position:absolute;
left:879px;
top:198px;
width:143px;
height:42px;
z-index:1;
#apDiv2 {
position:absolute;
left:814px;
top:178px;
width:109px;
height:56px;
z-index:1;
.Titulo1 {
color: #C4AF87;
font-weight: bold;
font-size: 18px;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: normal;
text-transform: capitalize;
.Corpo {
color: #C4AF87;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
line-height: normal;
font-weight: lighter;
font-variant: normal;
text-transform: none;
list-style-position: inside;
list-style-type: disc;
.Links {
color: #C4AF87;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: oblique;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: capitalize;
text-decoration: underline;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
body,td,th {
color: #C4AF87;
list-style-type: square;
a {
font-size: 14px;
</style>
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable --><!-- TemplateParam name="Subtitulos" type="boolean" value="true" -->
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* BeginOAWidget_Instance_2102522: #navigation */
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
left: 10px;
list-style: none;
z-index:999999;
width:auto;
ul#navigation li {
display:inline;
float:left;
width:102px;
ul#navigation li a {
display: block;
float:left;
color:#000000;
margin-top: -2px;
height: 25px;
width:100px;
background-repeat:no-repeat;
background-position:50% 10px;
background-color:transparent;
border:3 solid #000000;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
ul#navigation li a:hover{
background-color:transparent;
ul#navigation .home a{
background-image: url(../Images/Navegador/Home.png);
ul#navigation .about a{
background-image: url(../Images/Navegador/News.png);
ul#navigation .search a{
background-image: url(../Images/Navegador/Sistema.png);
ul#navigation .podcasts a{
background-image: url(../Images/Navegador/Fanarea.png);
ul#navigation .rssfeed a{
background-image: url(../Images/Navegador/Blog.png);
ul#navigation .photos a{
background-image: url(../Images/Navegador/Download.png);
ul#navigation .contact a{
background-image: url(../Images/Navegador/Contato.png);
/* EndOAWidget_Instance_2102522 */
</style>
<link rel="shortcut icon" href="/favicon.ico" />
<link href="../css/lightbox.css" rel="stylesheet" type="text/css" />
<link href="../css/sample_lightbox_layout.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* BeginOAWidget_Instance_2127022: #gallery */
.lbGallery {
/*gallery container settings*/
background-color: #c4af87;
padding-left: 20px;
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
width: 540px;
height: auto;
text-align:center;
.lbGallery ul { list-style: none; margin:0;padding:0; }
.lbGallery ul li { display: inline;margin:0;padding:0; }
.lbGallery ul li a{text-decoration:none;}
.lbGallery ul li a img {
/*border color, width and margin for the images*/
border-color: transparent;
border-left-width: 10px;
border-top-width: 10px;
border-right-width: 10px;
border-bottom-width: 20px;
margin-left:5px;
margin-right:5px;
margin-top:5px;
margin-bottom:5px:
.lbGallery ul li a:hover img {
/*background color on hover*/
border-color: #ffffe2;
border-left-width: 10px;
border-top-width: 10px;
border-right-width: 10px;
border-bottom-width: 20px;
#lightbox-container-image-box {
border-top: 0px none #ffffff;
border-right: 0px none #ffffff;
border-bottom: 0px none #ffffff;
border-left: 0px none #ffffff;
#lightbox-container-image-data-box {
border-top: 0px;
border-right: 0px none #ffffff;
border-bottom: 0px none #ffffff;
border-left: 0px none #ffffff;
/* EndOAWidget_Instance_2127022 */
</style>
<style type="text/css">
/* BeginOAWidget_Instance_2624026: #OAWidget */
.element{
width:140px;
height:70px;
background-color:transparent;
color:#333333;
float:left;
margin-right:10px;
overflow:hidden;
-moz-transition-property:height;
-moz-transition-duration:1s;
-o-transition-property:height;
-o-transition-duration:1s;
-webkit-transition-property:height;
-webkit-transition-duration:1s;
.element img{
width:140px;
height:70px;
.element:hover{
height:160px;
-moz-transition-property:height;
-moz-transition-duration:1s;
-o-transition-property:height;
-o-transition-duration:1s;
-webkit-transition-property:height;
-webkit-transition-duration:1s;
.empty{
clear:both;
height:20px;
background-color:#333333;
/* EndOAWidget_Instance_2624026 */
</style>
</head>
<Body lang="pt" onload="MM_preloadImages('../Images/Botoes/Jobs2.png','../Images/Botoes/Magias2.png','../ Images/Botoes/Summons2.png','../Images/Botoes/Races2.png')" onselectstart="return false">
<table width="1116" border="0" align="center" cellpadding="0" cellspacing="0" lang="pt">
<tr>
<th height="78" background="../Images/Layout/repeatleftTOP2.png" scope="col"> </th>
<th align="left" valign="top" background="../Images/Layout/teste-fundo-horizontal.png" scope="col"><p> </p>
<table width="1009" border="0" cellpadding="0" cellspacing="0" class="Corpo">
<!-- TemplateBeginRepeat name="Repeat_socials" -->
<tr>
<th width="100" scope="col"> </th>
<th width="727" align="right" scope="col"><a href="https://www.facebook.com/pages/Final-Fantasy-RPG/260352977361922" target="_new"><img src="../Images/icons/facebook.png" alt="icon_facebook" name="FacebookButton" width="50" height="50" id="FacebookButton" lang="pt" /></a><a href="https://twitter.com/ferparker" target="_new"><img src="../Images/icons/twitter.png" alt="icon_twitter" name="TwitterButton" width="50" height="50" id="TwitterButton" /></a><a href="http://finalfantasyrpg.wordpress.com" target="_new"><img src="../Images/icons/rss.png" alt="icon_rss" name="RssButton" width="50" height="50" id="RssButton" /></a></th>
</tr>
<!-- TemplateEndRepeat -->
</table></th>
<th background="../Images/Layout/repeatrightTOP21.png" scope="col"> </th>
</tr>
<tr>
<th width="50" height="46" background="../Images/Layout/ribbon-left.png" scope="col"> </th>
<th width="1012" background="../Images/Layout/ribbon-main.png" scope="col"><span class="Corpo">
<script type="text/javascript">
// BeginOAWidget_Instance_2149023: #social
$('.social').jsocial({
twitter : 'myID',
facebook : 'facebook.com/myID',
flickr : 'myID_2',
delicious : 'myID_3',
linked : 'linkedin.com/in/myID',
youtube : 'youtube.com/myID',
feed : 'myID_4',
friendfeed : 'myID_5',
digg : 'myID_6',
lastfm : 'myID_7',
center : false,
inline : true,
small : false,
newPage : false
// EndOAWidget_Instance_2149023
</script>
</span></th>
<th width="54" background="../Images/Layout/ribbon-right.png" scope="col"> </th>
</tr>
<tr>
<td background="../Images/Layout/repeatleft.png"> </td>
<td align="center" valign="top" background="../Images/Layout/bg-main.gif"><table width="1012" height="1086" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_">
<tbody>
<tr>
<td width="792" height="1086" valign="top" background="news.php_arquivos/bg-main.gif"><!-- TemplateBeginEditable name="CorpoEditavel" -->
<div align="center">
<div id="maincontent">
<div align="center">
<table width="701" height="31" border="0" align="center" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td align="center"><a href="../ffrpg.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Sistema','','../Images/Botoes/Sistema2.png',0)"><img src="../Images/Botoes/Sistema1.png" alt="Sistema" name="Sistema" width="120" height="37" border="0" id="Sistema" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image15','','../Images/Botoes/Races2.png',1)"><img src="../Images/Botoes/Races1.png" name="Image15" width="92" height="37" border="0" id="Image15" /></a><a href="../jobs.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Jobs','','../Images/Botoes/Jobs2.png',1)"><img src="../Images/Botoes/Jobs1.png" alt="Jobs" name="Jobs" width="79" height="37" border="0" id="Jobs" /></a><a href="../magia.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Magias','','../Images/Botoes/Magias2.png',1)"><img src="../Images/Botoes/Magias1.png" alt="Magias" name="Magias" width="106" height="37" border="0" id="Magias" /></a><a href="../summons.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Summons','','../Images/Botoes/Summons2.png',1)"><img src="../Images/Botoes/Summons1.png" alt="Summons" name="Summons" width="144" height="37" border="0" id="Summons" /></a></td>
</tr>
</tbody>
</table>
<p class="Corpo"><script type="text/javascript">
// BeginOAWidget_Instance_21490</script></p>
<table width="616" border="0" cellpadding="0" cellspacing="0" class="Corpo">
<tr>
<th width="25" height="25" background="../Images/Layout/table-topleft.gif" scope="col"> </th>
<th width="566" background="../Images/Layout/bg-table.gif" scope="col"> </th>
<th width="25" background="../Images/Layout/table-topright.gif" scope="col"> </th>
</tr>
<tr>
<td width="25" height="18" background="../Images/Layout/bg-table.gif"> </td>
<th width="566" background="../Images/Layout/bg-table.gif" scope="col"><p class="Corpo"><img src="../Images/Linhas/Sistema---Sistema.png" alt="RaceLine" height="74" width="500" /></p>
<table width="556" border="0" cellpadding="0" cellspacing="0" class="Corpo">
<tr>
<th width="200" height="203" scope="col"><table width="180" height="88" border="0" cellpadding="0" cellspacing="0">
<tr>
<th class="Corpo" scope="col"><img src="../Images/Stuff/Logo-Fundo-Tranp.png" alt="LogoFFRPG" width="180" height="180" /></th>
</tr>
</table></th>
<th width="356" class="Corpo" scope="col">Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG</th>
</tr>
</table>
<p class="Corpo">Final Fantasy RPG Final Fantasy RPG Final Fantasy </p>
<p class="Corpo">RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG Final Fantasy RPG </p></th>
<td width="25" background="../Images/Layout/bg-table.gif"> </td>
</tr>
<tr>
<td width="25" height="23" background="../Images/Layout/table-bottomleft.gif"> </td>
<th width="566" background="../Images/Layout/bg-table.gif" scope="col"> </th>
<td width="25" background="../Images/Layout/table-bottomright.gif"> </td>
</tr>
</table>
</div>
<p align="center" class="Corpo"><br />
</p>
<div align="center" class="Corpo">
<table align="center" border="0" cellpadding="0" cellspacing="6">
<tbody>
<tr>
<td width="656"><div align="center">
<p class="Corpo"><img src="../Images/Layout/Divider Linha.png" alt="divider" height="64" width="494" /></p>
<p> </p>
</div></td>
</tr>
<tr>
<td width="656" align="center" valign="top"><p class="Titulo1">Título 1
GALLERY PLUS
</p>
<p class="Titulo1"> </p>
<div id="gallery" class="lbGallery">
<ul>
<li> <a href="../Images/Jobs/Mago Negro.png" title="AAAAAAAAAAAAAAA"><img src="../Images/Jobs/thumbnails/Mago-NegroThumb.png" alt="Flower" width="51" height="100" /></a> </li>
<li> <a href="../Images/Jobs/Alquimista.png"><img src="../Images/Jobs/thumbnails/AlquimistaThumb.png" alt="Tree" width="46" height="100" /></a> </li>
<li> <a href="../Images/Jobs/Arqueiro.png"><img src="../Images/Jobs/thumbnails/ArqueiroThumb.png" alt="" width="87" height="100" /></a> </li>
<li> <a href="../Images/Jobs/Bardo.png"><img src="../Images/Jobs/thumbnails/BardoThumb.png" alt="" width="54" height="100" /></a> </li>
<li> <a href="../Images/Jobs/Cavaleiro das Runas.png"><img src="../Images/Jobs/thumbnails/Cavaleiro-das-RunasThumb.png" alt="" width="53" height="100" /></a><a href="../Images/Jobs/Apostador.png"><img src="../Images/Jobs/thumbnails/ApostadorThumb.png" alt="Flower" width="85" height="100" /></a><a href="../Images/Jobs/Cavaleiro Magico.png"><img src="../Images/Jobs/thumbnails/Cavaleiro-MagicoThumb.png" alt="Tree" width="70" height="100" /></a><a href="../Images/Jobs/Cavaleiro Negro.png"><img src="../Images/Jobs/thumbnails/Cavaleiro-Negro.png" alt="" width="76" height="100" /></a><a href="../Images/Jobs/Invocador Negro.png"><img src="../Images/Jobs/thumbnails/Invocador-NegroThumb.png" alt="" width="51" height="100" /></a><a href="../Images/Jobs/Ladrao.png"><img src="../Images/Jobs/thumbnails/LadraoThumb.png" alt="" width="73" height="100" /></a></li>
</ul>
</div>
<script type="text/javascript">
// BeginOAWidget_Instance_2127022: #gallery
$(function(){
$('#gallery a').lightBox({
imageLoading: '<img src="../Images/lightbox/lightbox-ico-loading.gif" width="32" height="32" alt="Ico_Loading" />', // (string) Path and the name of the loading icon
imageBtnPrev: '<img src="../Images/lightbox/lightbox-btn-prev.gif" width="63" height="32" alt="Ico_Previous" />', // (string) Path and the name of the prev button image
imageBtnNext: '<img src="../Images/lightbox/lightbox-btn-next.gif" width="63" height="32" />', // (string) Path and the name of the next button image
imageBtnClose: '<img src="../Images/lightbox/lightbox-btn-close.gif" width="66" height="22" />', // (string) Path and the name of the close btn
imageBlank: '<img src="../Images/lightbox/lightbox-blank.gif" width="1" height="1" />', // (string) Path and the name of a blank image (one pixel)
fixedNavigation: true, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
containerResizeSpeed: 400, // Specify the resize duration of container image. These number are miliseconds. 400 is default.
overlayBgColor: "#999999", // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.
overlayOpacity: .6, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9
txtImage: 'Image', //Default text of image
txtOf: 'of'
// EndOAWidget_Instance_2127022
</script>
<p> </p>
<p></p>
<p class="Corpo">Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto Corpo de Texto </p>
<span class="Corpo"><a href="endereço do link" class="Links">Link</a></span></td>
</tr>
<tr>
<td width="656"><div align="center" class="Corpo"><img src="../Images/Sign_Up.png" alt="a" width="150" height="44" /><br />
</div></td>
</tr>
</tbody>
</table>
</div>
<p align="center" class="Corpo"> </p>
</div>
<p class="Corpo"><br />
</p>
</div>
<!-- TemplateEndEditable --></td>
<td width="220" colspan="6" valign="top" background="news.php_arquivos/bg-main.gif"><!-- TemplateBeginEditable name="LateralEditavel" -->
<div id="maincontent2">
<div align="center">
<p><span class="Corpo"><img src="../Images/Sign_Up.png" alt="News" name="Brass1" width="150" height="44" border="0" id="Brass1" title="News" /></span></p>
<table width="193" height="194" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<th width="192" height="508" background="../Images/Layout/bg-table.gif" scope="col"><table width="167" height="478" border="0" align="center" cellpadding="0" cellspacing="0" background="../Images/Layout/bg-table_002.gif">
<tr>
<th height="478" background="../Images/Layout/bg-main.gif" scope="col"><span class="Corpo"><img src="" alt="Banner" name="Banner" width="167" height="478" align="middle" class="Corpo" id="Banner" style="background-color: #FFFFE2" /></span></th>
</tr>
</table></th>
</tr>
</table>
<p><span class="Corpo"><img src="../Images/Sign_Down.png" alt="d" name="Brass2" width="150" height="44" id="Brass2" /></span></p>
<p> </p>
<p><span class="Corpo"></span></p>
</div>
</div>
<!-- TemplateEndEditable --></td>
</tr>
</tbody>
</table>
<p align="center"> </p></td>
<td background="../Images/Layout/repeatright.png"> </td>
</tr>
<tr>
<td height="103" background="../Images/Layout/Bottomleft-shadow.png"> </td>
<td background="../Images/Layout/footer.png"> </td>
<td background="../Images/Layout/Bottomright-shadow.png" background-repeat: no-repeat> </td>
</tr>
<tr>
<td height="10" colspan="3" background="../Images/dropshadow-bottom3.png"> </td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div class="social"></div>
<p> </p>
<!-- TemplateBeginRepeat name="Repeat_Navegacao" -->
<ul id="navigation">
<li class="home"><a href="../index.html" class="Corpo">Home</a></li>
<li class="about"><a href="../news.html" class="Corpo">News</a></li>
<li class="search"><a href="../Sistema-FFRPG.html" class="Corpo">Sistema FFRPG</a></li>
<li class="photos"><a href="../downloads.html" class="Corpo">Downloads</a></li>
<li class="rssfeed"><a href="../favicon.png" class="Corpo">Blog</a></li>
<li class="podcasts"><a href="../fan_area.html" class="Corpo">FanArea</a></li>
<li class="contact"><a href="mailto:[email protected]" class="Corpo">Contato</a></li>
</ul>
<!-- TemplateEndRepeat --><script type="text/javascript">
// BeginOAWidget_Instance_2102522: #navigation
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
// EndOAWidget_Instance_2102522
</script>
<p> </p>
<p> </p>
<p> </p>
<script language=JavaScript>
<!--
var mensagem="";
function clickIE() {if (document.all) {(mensagem);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(mensagem);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
</Body>
</html>Julie726 wrote:
Actually, I'm still having a problem getting those buttons to display before I worry about moving their positions.
They have been uploaded to the correct locations. I can't figure out why they don't display.
They don't display because the link to those buttons points to an "images" folder (lowercase I) but they're stored on the server in "Images" folder (capital I).
http://www.julieappelt.com/images/lightbox/lightbox-btn-close.gif does not work
http://www.julieappelt.com/Images/lightbox/lightbox-btn-close.gif works
It's usually best to avoid mixing cases when naming folders and files to avoid these issues, esp on Linux servers. Stick to all lowercase.
Maybe you are looking for
-
How do you change out hard drives without losing all your software license keys
I have lots of cash tied up in software.
-
Getting rid of duplicates in SoundTrack Pro library
Hello I recently installed STP 2 over my previously installed STP, and have a problem with duplicate files in the library. The previous installation was lacking files, so I decided to installed all files again. How should I proceed to weed out the du
-
Where do I find my Acrobat Serial Number? It's nowhere on the box.
Hi there, I've been trying to licence my Acrobat Pro software, but I can't find the serial number on the box. I only have the barcode Can anyone tell me where I could find this, because I have about 5 days left on my trial version. Prema
-
PHOTO FILE DELETED FROM MAIN MENU ON ITUNES
When I first bought my ipod, I deleted the photo section from the main menu on the left side in itunes. now I cannot put photos on my ipod. professional Windows XP professional Windows XP
-
Hello! While using the browse-mode, it seems to sort albums alphabetically instead of chronologically. Is there a way to change this? Alphabetical sort is very tiresome with artists who have released many albums. It's hard to associate a name to a ce