Safari not rendering image during a on-click event

Question

I am so frustrated. Just when I thought I had this figured out I have the client look at it (they use Safari) and the image doesn't come out!

They also don't want the text for each image but rather a small number to click on as seen in this image: http://www.winteradagency.com/mrw/images/marquita1234.jpg

The site with the issue is at http://www.winteradagency.com/mrw/real_estate.php?page=4

I've set up the CSS as inline so it didn't interfere with the rest of the site. I know it's not proper.

I do not want a border on the image. I want it to look just like it does in the above mentioned picture.... that is what the client wants.

Any ideas would be greatly appreciated.

I got the script from: http://www.twospy.com/galleriffic/#1

Answer 1

First thing i would try is to change

<script type="text/javascript"> 
    // We only want these styles applied when javascript is enabled
    $('div.navigation').css({'width' : '300px', 'float' : 'left'});
    $('div.content').css('display', 'block');

    $(document).ready(function() {                          
        // Initialize Minimal Galleriffic Gallery
        $('#thumbs').galleriffic({
        imageContainerSel:      '#slideshow',
        controlsContainerSel:   '#controls'
        });
    });
</script>

to

<script type="text/javascript"> 
    $(document).ready(function() {                          
        // We only want these styles applied when javascript is enabled
        $('div.navigation').css({'width' : '300px', 'float' : 'left'});
        $('div.content').css('display', 'block');

        // Initialize Minimal Galleriffic Gallery
        $('#thumbs').galleriffic({
        imageContainerSel:      '#slideshow',
        controlsContainerSel:   '#controls'
        });
    });
</script> 

Answer 2

The border is from the <a> enclosing your image. Change:

div.content a, div.navigation a:hover {
        text-decoration: underline;
        color: #777;
}

to

div.content a, div.navigation a:hover {
        text-decoration: none;
        color: #777;
}

Or if you want underline on normal links, write a rule specifically for your image.

Not sure about your other issue getting the links reformatted.