Need to find error

HTML & CSS
1

I hope I am posting this in the correct area. If not, please advise what area it should be put in.

Now, I am not a Java person at all. I have copied the stuff into my page from another source, hopefully following the directions. However, I get an error on the page and the expected results are not even close to what I want.

My page is http://saccc567.com/Test/Pictures09.html but I would hope the result would look something like the following page [URL=“http://www.incarclubcouncil.org/photo-gallery.php”]http://www.incarclubcouncil.org/photo-gallery.php

When I use my page, there are errors. I don’t understand them or maybe I did something wrong. Please advise as to what is wrong and/or how the best way to accomplish fixing the could be.

Thanks
F

2

http://saccc567.com/Test/Pictures09.html doesn’t appear to work, but http://saccc567.com/Test/Pictures.html

On that page, the error is that $ is not defined. Why? Because jQuery hasn’t been loaded.

Why not? Look at the following part of your page.


<script type="text/javascript" src="../jquery/jquery-1.3.2.min.js"></script> 
<script type="text/javascript" src="../jquery/jquery.easing.1.3.js"></script> 
<script type="text/javascript" src="../jquery/jquery.fancybox-1.2.1.js"></script>

Those files do not exist, which is the cause of your problem.

3

Paul,

Thanks. I forgot about the path - changed it and now works but…

Need to understand how to change the font color of the “title”. Can’t seem to see that anywhere.

Thanks again.

F

4

You can do all sorts of fancy formatting of the title, as demonstrated on the tips and tricks section of the fancybox site.

However, to keep things simple, the fancybox css file is where you would go to set the title color.


div#fancy_title div {
    color: #FFF;
    font: bold 12px Arial;
    padding-bottom: 3px;
}

For reference purposes, here is the HTML that the fancybox generates for the title.


<div id="fancy_title" style="display: block; opacity: 0; ">
    <table cellspacing="0" cellpadding="0" border="0"><tbody><tr>
        <td class="fancy_title" id="fancy_title_left"></td>
        <td class="fancy_title" id="fancy_title_main"><div><span class="count">Image 1 of 14</span>Looks like someone is having a good time!</div></td>
        <td class="fancy_title" id="fancy_title_right"></td>
    </tr></tbody></table>
</div>
5

Paul,

Thanks. This is not working for my picture page - http://www.saccc567.com/Test/Pictures.html.

I was trying to get my pictures to emulate the example in Tip 7. (Custom title formating - lightbox style) of http://fancybox.net/blog but cannot figure it out.

I know there are things in the page code that should not be there and maybe that is causing things to go “haywire”.

Thanks for your advise and help
F

6

It looks like you’ve broken something.

Take it back to where it was working before, and I’ll help you on from there.

7

It appears to be working now but not quite the way I want.

Thanks again
F

8

Why not? Because the reference to images/closelabel.gif doesn’t exist?

9

Paul,

First, I want to have the color of the text black (or dark red) but cannot get it to change.

Second, the closelabel.gif does exist in the images folder.

Last, there is no “shadow” as the example has.

Thanks for keeping up with this.

F

10

The color is set in the fancybox.css file, under declarations such as:

div#fancy_title div
and
fancy_title span.count

That shadow is once again defined in the CSS. Look at the declarations such as:
div.fancy_bg_n
and
div.fancy_bg_ne
and
div.fancy_bg_e

as well as the others.

11

Paul,

I appreciate your staying with me on this. I know that I may sometimes get “overbearing” but am frustrated that I cannot figure this out.

I looked in my jquery.fancybox.css file (on the site) and the color is set to #CCC in the div#fancy_title div area. Also, the #fancy_title SPAN.count has color at #000 and that seems to work OK but the title is still white. Also, all of this, I think, is supposed to have a white background.

I changed the paths for the arrows (which, by the way, are not showing either) to be the full URL of the site. Maybe that is wrong.

SO, am still trying to understand how to make this work like I think it should and also what I am doing wrong (which I know I am doing something incorrectly).

If you need more files, let me know and I can post them.

Thanks again for all you help - I know I will get it sooner or later.
F

12

I am moving this thread to the CSS forum.

Your CSS file most-likely is being locally cached.

That’s controlled by this style declaration:
div#fancy_title

13

Figured it out. Cleared the cache (thanks Paul) and had some code in the wrong place and now it almost works

F