Fuzzy slide show

I'm having trouble in slide show with images that are smaller than the screen size, some of which remain fuzzy unless I zoom the image to 100%. This doesn't actually increase the size of the image, but does sharpen it. Images larger than the screen size come up fine. It is inconvenient to have to zoom every small image, because moving to the next picture loses the edges of larger images unless I remember to unzoom. Any ideas?
thanks!

The playback in iMovie is just a preview and is of lower quality than your final product on DVD. When you burn your movie to a DVD and then play it, the quality will be much higher.
I use iMovie to make slide shows all the time.
When you send your movie to iDVD for burning, and the drop down box asks you if you want iMovie to render the photos, refuse that and click on Proceed without rendering. iDVD will do the rendering and it does a much better job than iMovie, and you will get higher quality.

Similar Messages

I made a slide show using imovie. When I play it back on my imac, the slideshow looks perfect. However when I burned in via iDVD and play the disc, the resolution drops off. The video appears fuzzy and not sharp. Any ideas why?

I made a slide show using imovie. When I play it back on my imac, the slide show is crystal clear and sharp. I burned a disc of the slide show using iDVD. When I played the dvd the resolution is very poor. Fuzzy and shakey images. I tried various solutions, Apple tec told me to go to preferences on iDVD and select "professional" to get higher resolution. Tried that but results still the same. Any ideas?

When you play on your Mac, you can have resolution up to 1920x1080.
When you burn to iDVD you convert to 640x480.

I am making a slide show, but when importing pic from organizer, they are fuzzy??

I am making a slide show, but when importing pic from organizer, they are fuzzy??

You need this forum: Community: Premiere Elements | Adobe Community
You are in the Premiere Pro forum now.

Photo Magico Slide Show on my Sony Bravia via MBP

Hello,
before you all get upset: I have searched the forum already but I couldn't find the correct answer. I would like to connect my MBP to my 40 inch Sony Bravia to watch photo slide shows from Photo Magico.
Waht is the best connection not to loose any quality? I think whatever I will do it will never get to the TV as good as it is on my MBP. In other words: The use of HDMI connection is not really necessary?
Thanks

What you have is an extended desktop. If you move the mouse cursor off the edge of the MBP's screen you will see it appear on the TV. Similarly you can drag windows from the MBP's screen to the TV. At present the MBP's screen is the primary display and shows the menu bar and dock, and the TV is the secondary display. To change this go into System Preferences -> Displays -> Arrangement. You will see an image of two screens, a smaller one representing the MBP's display and a larger one representing the external display. At the top of the smaller screen in the image is a bar, this represents the menu bar at the top of the screen. Drag it from the smaller screen to the larger screen. The external display will become the primary display and the menu bar and dock will appear there and any new windows or applications that you open subsequently will appear there too.
davscanlon's suggestion to use mirroring will work, but you won't be using the native resolution of the TV which could result in fuzziness or bluriness of the image on the TV.

Need Help Adding Music to Slide Show - PS Elements 11

I am using PS Elements 11 to create a slide show. The photos and transitions are complete. But when I try to add music in an mp3 format, the songs are there but the text for the songs does not appear in the bar below the photos in the slide show review mode. All I can see is a fuzzy gray line. I need to see the text for the songs so I can trim and reorder the songs. I have tried to create a new slide show with new music but the music area is also fuzzy. Texts appeared one time but no longer. Please help! Need for Wed.!!!!

Welcome to the forum.
As Mylenium points out, this is not the Photoshop Elements Forum.
I will Move your post to the PSElements Forum, where you will get the answers to your question.
Good luck,
Hunt

Photo Slide Shows - inconsistent quality

Last summer I burned a very complicated idvd photo slide show using digital photos in RAW format from my Nikon D70 and the slides looked really great. I just tried to do it again - same camera, same lens, still in RAW and the photos - while looking good during construction and test runs, come out very fuzzy on the burned dvd. I'm really puzzled. Can anyone explain what I might have done differently to yield such different results? [and how I get back to the good results?)
iMac Mac OS X (10.4.9) different photo quality in different burns

Tom,
I hope you have read Preparing images for DVD slideshows at http://docs.info.apple.com/article.html?path=iDVD/6.0/en/17.html
The best you can do is get about a 640x480 equivalent image on a DVD - that's about 0.3 megapixels - so there is NO way you can match the image quality of your high resolution digital images.
Despite their names, you will get slightly better image quality using the 'Best Performance' mode than you will with the 'Best Quality' mode. Perhaps you used BP before and BQ now.
I have used FotoMagico for creating slideshows and feel I got better image quality than iMovie or iDVD and some people like Photo to Movie.
F Shippey

Slide show - iMovie, iPhoto, iDVD or Final cut?

Apple provides so many different ways to create a slide show I'm not sure which is best?
My highest priority is best possible quality. I prefer the flexibility, though more work, associated with iMovie (06). I own FCE, but it appears to be overkill. iphoto, and iDVD are nice and easy, but limited in control of music, and text overlays....
I recently created a DVD importing from a slide show from iPhoto, keynote, and native iDVD slide shows. I created it using the "proffesional quality" pref setting. it's good, but I don't think it's great! Some flickering on the Ken Burns affects, and text from keynote is a little fuzzy on the edges. I tried to make one with iMovie (06) and the application 'cored' on me (discouraging). But I've had good luck with iMovie in the past.
Can anyone share with me their experience to achieve the highest quality output?
Thanks,
Scott

As a general rule of thumb, Final Cut will usually be your best bet as it is the mini version of the pro app. iMovie '06 is good for quality. iMovie '08 seems to be a more crippled version, though. So, if that is the case, I recommend FCE.
Cheers,
Michael

Best export settings for slide show

I created a 3 page slide show in photoshop that I would like to burn to a DVD. The slides include copy, photos and a few logos. They look beautiful in photoshop. I've tried importing them to Final Cut Pro in order to add music and some transitions, but when I export to compressor or quicktime and burn to a DVD using Toast, everything is really fuzzy, even on my HD TV.
So I thought maybe I should do this in Motion. I exported to quicktime and used the animation codec and it looks fantastic in QT but loses some quality when I burn it to a DVD in toast.
Is my problem with Motion or Toast? And is this the way to go about it? I know FCP way better than Motion and would like to stay there. Is it possible to get the same results in FCP?

Tommyjamg wrote:
Basically I created a "powerpoint" presentation in photoshop, a series of photos with copy, etc.
I imported those slides into FCP and added transitions between slides, had some photos fade
in/out, nothing spectacular.
You left out the critical information: what size is the sequence?
Tommyjamg wrote:
And from what I've read on this post, it won't matter how I send it to compressor or qt, it will only
look as good as the DVD lets it because it's SD. Although that doesn't make sense to me because
I've had good luck sending movies I've made in FCP to a DVD and the video, as well as the titles
look pretty good.
Could be but your other movies were probably created using more DVD-friendly sequence settings and codecs.
Tommyjamg wrote:
What is the difference between a DVD and a DVD-ROM?
ROM is read-only-memory. It's just a disk with some files on it. DVD is a tightly spec'd MPEG2 video format.
bogiesan

How can I control the music that plays during Apple TV photo slide shows?

I don't want to make my parents listen to Breaking Benjamin music as they watch my photo slide shows on Apple TV. Need something more sedate. But if a B.B. song is in my iTunes music library, it is a candidate for random selection as background music for my slide shows. How do I control what music plays during Apple TV photo slide shows?

What I find is really silly, is the fact the music video's are listed under that artists albums in the Music menu. And when you go into the video 'album' (called 'Unknown' unless you change it) there is an option to shuffle the tracks. Clicking this just results in an error message. So, they should either remove that option if it is a video album, or, better yet, GET IT TO WORK. So silly of them to omit this.
I have submitted feedback.

I created a slide show in imovie for my daughters 21st with voice overs from friends and family which was all working fine but now the voice recordings are not playing at all. Obviously some setting has changed but I can't find which one.

I created a slide show in imovie for my daughters 21st with voice overs from friends and family which was all working fine but now the voice recordings are not playing at all. Obviously some setting has changed but I can't find which one.

I created a slide show in imovie for my daughters 21st with voice overs from friends and family which was all working fine but now the voice recordings are not playing at all. Obviously some setting has changed but I can't find which one.

A How To: Create a Widescreen High Definition Slide Show from the Organizer

[EDIT] I just tried another one and, weirdly, that produced an output with black bars around all four sides! So maybe this 'how to' is not 100%. I have considered deleting the post altogether but, as it does still produce a superior slideshow quality file than the standard ones provided with Elements, I've decided to leave it with this edit added at the top for additional info.[END_EDIT]
In answering a question in another forum I found a nice quick way to create proper widescreen high definition slide shows from just the Elements Organizer. Apologies if this is 'old news' to readers, but I've not seen this described elsewhere so I thought I'd share it.
The Organizer Slide Show creator, if not wanting to edit in PRE, provides a small set of Windows Media Player profiles to create .wmv files. But the best of these goes only to 1024x768 (a 4:3 monitor resolution setting). I've noticed, but never paid much attention to, that at the bottom of the Slide Size box there is a 'Browse for more' option that lets you search for additional Windows Media Encoder profiles. Investigation showed me that I can download the Windows Media Encoder software from Microsoft and create my own profiles. But even further investigation showed me that someone had already done this! I've tested their full HD profile and it works just fine (1920x1080).
So if you are just after a straightforward slide show (i.e. not needing PRE features) but want it displayed on your Full HD TV set here is what you do:
Download the HD Profiles from http://forums.nexusmods.com/index.php?/topic/236895-hd-profiles-for-windows-movie-maker/. There's also a couple of useful SD sizes there as well. Save them somewhere you can easily find them.
Create your slide show in the Organizer. Obviously use appropriately sized images for HD. There's little point outputting an HD wmv file using low resolution and/or 4:3 aspect ratio images.
Save and Output your slide show.
In the output dialog ('Save As a File') scroll down to the bottom of Slide Size and select 'Browse for more ...'.
Browse to the file you downloaded in step 1 and click Open.
Click OK and your Widescreen HD .wmv file is prepared.
Here's a Gspot analysis of my test output file. As you can see it is an HD file with a 16:9, square pixel, aspect ratio.
Ta Da!
Cheers,
Neale
Insanity is hereditary, you get it from your children
If this post or another user's post resolves the original issue, please mark the posts as correct and/or helpful accordingly. This helps other users with similar trouble get answers to their questions quicker. Thanks.

nealeh
You did not mention a specific Premiere Elements Elements Organizer combo for this, so for now I will address this from the version 11, not Windows Movie Maker, perspective if I need to get version specific.
.prx
The Browse for More is a well known route and does offer at least one Adobe profile for 1280 x 720 16:9. I am not sure where you came up with the lesser resolution,1024 x 768 that you mentioned. The Windows Media profiles have existed for several versions of Elements Organizer. Those Adobe ones that you do not see under Output Save As A File Movie (.wmv), can be found in the Windows 7 or 8 64 bit path
Local Disc C
Profile Files (x86)
Adobe
Elements 11 Organizer
Assets
Locale
en_US
tv_profiles
in the tv_profiles Folder are included the .prx files
.....10. 640 x 480 Enhanced Definitions
.....12. 852 x 480 Widescreen Enhanced Definition
.....14 1280 x 720 Widescreen High Definition
A homemade 1920 x 1080 16:9 30 frames per second .prx has long been sought but not that easily produced by many using with the Windows Media Encoder Editor. Apparently you have found one online, and it does get accepted into the Premiere Elements 11 Browse for More choices. And, if you do a gspot readout for the wmv output from Elements Organizer 11, it will display all the "right" properties that you hoped for and that are shown in your screenshot.
The bottom line, why bother with the wmv slideshow? If you take your original photos and size them for 1920 x 1080 16:9, use them in the Elements Organizer 11 Slideshow Editor (Crops used in preferences), use the Edit with Premiere Elements Editor command, what you get in Premiere Elements 11 is full and good in all regard. Have you tried it?
I can see your interest if this is HD going to HD (AVCHD on DVD or Blu-ray disc format on Blu-ray disc, but I do not see this for an Elements Organizer Slideshow that is going to DVD-VIDEO widescreen.
More later.
ATR

Final cut pro crashing with slide show photos

I am working with a large slide show - a few movie clips, but mostly still images from Aperture. The photos were shot wtih a Nikon D300 in Raw, not that I think that matters much at all.
Becasue this is a slide show I am working wth short durations for the images - usually 3:14. Most of the transitions are simply cross dissolve, but some are more complex.
I am getting again and again crashes - or the spinning color circle going to oblivion and requiring a Force Quit.
Either can happen when adding new material, moving arround existing material, or trying to reset durations, add text, different transitions, or working wth the Ken Burns options. Sometimes it also happens when resizing the time line zoom level.   This marvelous feature seems the most consistent way of trashing the application so I tend to leave it alone.
I may be able to work for an hour or only a few minutes. Sometimes deleting and re-adding an image seems to help, but that may not be true - most of the time it's just simply random.   The system has 14 Gig Ram and I am using iCleanMemory now to see how much is in play. A crash / freeze may occur with a lot or a little - usually looks like I have about 8.9 Gig in play for normal use of Final Cut and no clear change when it crashes / freezes.
Clearly the images are compatible - they are from Aperture and there is no consistency in always the same image being the issue.
Below is the first part of the error report dump.
Hoping someone has an idea for how to overcome this.
Appreciate the thoughts.
Cheers -
Dan
Process:         Final Cut Pro [1012]
Path:            /Applications/Final Cut Pro.app/Contents/MacOS/Final Cut Pro
Identifier:      com.apple.FinalCut
Version:         10.0 (179114)
Build Info:      ProEditor-179110400~1
App Item ID:     424389933
App External ID: 3491984
Code Type:       X86-64 (Native)
Parent Process: launchd [202]
Date/Time:       2011-08-17 17:57:45.775 -0600
OS Version:      Mac OS X 10.7.1 (11B26)
Report Version: 9
Interval Since Last Report:          50891 sec
Crashes Since Last Report:           1
Per-App Interval Since Last Report: 2401 sec
Per-App Crashes Since Last Report:   1
Anonymous UUID:                      D1C2721F-974C-4845-BFD9-2EA572309772
Crashed Thread: 17 CVDisplayLink
Exception Type: EXC_BAD_ACCESS (SIGBUS)
Exception Codes: KERN_PROTECTION_FAILURE at 0x000000010371ed40
VM Regions Near 0x10371ed40:
    IOKit                  00000001036ff000-0000000103700000 [    4K] rw-/rw- SM=ALI
--> MALLOC_TINY            0000000103700000-0000000103800000 [ 1024K] rw-/rwx SM=COW
    MALLOC_SMALL           0000000103800000-0000000103885000 [ 532K] rw-/rwx SM=ZER
Application Specific Information:
objc[1012]: garbage collection is OFF

Well, I filmed many of those videos in HDV (the 2x2 wall, the 5x5 wall and some of the 10x10 wall). Plus I converted the whole project to HDV because it is the way I displayed it (thru camera to Plasma TV's) and I wanted the HD space to work with and since part of my videos were HDV I figured that would be best.
Of course the DV footage is not so good quality, but when made very small for that big screen it looks fine I think. Yeah the AIC codec is great but it takes 4 times as much room, but you think that would work better hey?
I just don't want Final Cut crashing like that. I don't care if it can't play it back in real time or it takes 10 seconds to display 1 frame.
I have not used motion....would it work for what I did. Remember I used over 100 discreet video streams I had. I don't want to replicate the same layer...you get the drift.
Did you see it in youtubes HD? What did you think of the quality?

Slide Show Problems--Please help

In Go Live CS 7.0.2, why does my slide show preview fine, but when I upload it to the internet it doesn't work? Please Help!
Trouble page...
http://www.ifsoinklined.com/Pages/traditional.html
Thanks!

In article <[email protected]>,
[email protected] wrote:
> THANK YOU A MILLION TIMES! What is wrong with me?
I'm sure there's nothing wrong with you. Just make sure your GL is set
to automatically a) flattend the Script Library and b) to upload *all*
modified items. From that point on it should be all smooth sailing :-)
Cheers Martin

ANNC: Slide Show Magic

http://www.projectseven.com/products/galleries/ssm/
Leaps beyond the ordinary...
Efficient code and buttery smooth animations make for a truly
engaging
user experience. Slide Shows and individual images can be
bookmarked and
all images can be viewed - even if JavaScript is disabled.
Search Engine Friendly
Unlike many of today's Flash and AJAX applications, Slide
Show Magic
markup is always fully visible and indexable by leading
search engines.
Auto-Choreographed Animation
Slide Show Magic detects the size of each incoming full-size
image. If
it's the same size as the current image, the system will
employ a smooth
cross-fader - simultaneously fading out the current image as
the new one
fades in. If the incoming image is a different size than the
current
one, the system will fade out the current image, glide the
image
container to the size of the incoming image, then fade the
new image in.
It's all automatic.
Staged preloader
When the slide show is running in automatic mode, the system
will
preload the next image as the current one is being shown,
providing a
seamless experience in most cases.
Intuitive toolbar controls
The on-page toolbar contains conventional media controls:
First,
Previous, Play, Pause, Next, and Last buttons. It also
contains a slider
bar that allows users to adjust the slide show timing, plus
buttons to
toggle visibility of the thumbnail display and navigation
menu, and an
image counter.
Drag-enabled thumbnail panel
The Thumbnail panel can be dragged about the screen, enabling
users to
fine-tune the interface for best viewing of the show.
Full-Size images can be hyperlinks
Each full-size image can optionally be set as a hyperlink to
another
page, programmed to open in a new window or tab.
Image descriptions
Each full-size image can display an optional description,
which can
contain any type of valid markup (paragraphs, tables, DIVs,
lists,
links, or images).
Automated image processing with Fireworks...
Web-ready images are automatically produced from your
original images,
which can be located on any drive connected to your computer
- including
drives mounted by your digital camera. Slide Show Magic
handles all
image processing automatically - preserving your original
files in their
original locations in their original and unaltered states.
Your images
are scaled, optimized, and neatly organized into folders
within your
defined site.
Import your existing images...
Point to a folder (or folders) that contain your existing
full-size and
thumbnail image and Slide Show Magic will match them up and
add them to
your slide show - unaltered and ready to view.
Organize Images into sets
Slide Show Magic enables you to define logical image sets and
organizes
the thumbnail panel into navigable sets.
Mix landscape and portrait orientations
Your images are never distorted in any way. Original aspect
ratios are
always preserved. Use both landscape and portrait images in
the same
slide show.
Deploy alone or inside existing layouts
Slide Show Magic can be inserted on a page by itself or
inside an
existing page.
Select from 6 Themes
Select a dark toolbar, a light toolbar, shadow boxes (in 3
sizes), or an
image rotator interface. Style themes can even be switched
for existing
slide shows.
Manage it all inside a dedicated Dreamweaver Interface
Add (append) new images
Delete images or re-order them
Manage Descriptions, links, and ALT text
Edit existing full-size or Thumbnail images
Reprocess all of your slide show's images
And lots more, including a comprehensive manual and free tech
support.
$95
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"

Al,
Wow. That's extremely cool. I currently don't have a need for
a slideshow,
but in the future if I do, you know where I'm heading to.
Nice product!
Shane H
[email protected]
http://www.avenuedesigners.com
=============================================
Back for 2007, close-up magic:
http://deceptivemagic.com
Web dev articles, photography, and more:
http://sourtea.com
=============================================
Proud GAWDS member
http://www.gawds.org/showmember.php?memberid=1495
Delivering accessible websites to all ...
=============================================
"Al Sparber- PVII" <[email protected]> wrote in
message
news:[email protected]...
>
http://www.projectseven.com/products/galleries/ssm/
>
>
> Leaps beyond the ordinary...
>
> Efficient code and buttery smooth animations make for a
truly engaging
> user experience. Slide Shows and individual images can
be bookmarked and
> all images can be viewed - even if JavaScript is
disabled.
>
>
> Search Engine Friendly
>
> Unlike many of today's Flash and AJAX applications,
Slide Show Magic
> markup is always fully visible and indexable by leading
search engines.
>
>
> Auto-Choreographed Animation
>
> Slide Show Magic detects the size of each incoming
full-size image. If
> it's the same size as the current image, the system will
employ a smooth
> cross-fader - simultaneously fading out the current
image as the new one
> fades in. If the incoming image is a different size than
the current one,
> the system will fade out the current image, glide the
image container to
> the size of the incoming image, then fade the new image
in. It's all
> automatic.
>
>
> Staged preloader
>
> When the slide show is running in automatic mode, the
system will preload
> the next image as the current one is being shown,
providing a seamless
> experience in most cases.
>
>
> Intuitive toolbar controls
>
> The on-page toolbar contains conventional media
controls: First, Previous,
> Play, Pause, Next, and Last buttons. It also contains a
slider bar that
> allows users to adjust the slide show timing, plus
buttons to toggle
> visibility of the thumbnail display and navigation menu,
and an image
> counter.
>
>
> Drag-enabled thumbnail panel
>
> The Thumbnail panel can be dragged about the screen,
enabling users to
> fine-tune the interface for best viewing of the show.
>
>
> Full-Size images can be hyperlinks
>
> Each full-size image can optionally be set as a
hyperlink to another page,
> programmed to open in a new window or tab.
>
>
> Image descriptions
>
> Each full-size image can display an optional
description, which can
> contain any type of valid markup (paragraphs, tables,
DIVs, lists, links,
> or images).
>
>
> Automated image processing with Fireworks...
>
> Web-ready images are automatically produced from your
original images,
> which can be located on any drive connected to your
computer - including
> drives mounted by your digital camera. Slide Show Magic
handles all image
> processing automatically - preserving your original
files in their
> original locations in their original and unaltered
states. Your images are
> scaled, optimized, and neatly organized into folders
within your defined
> site.
>
>
> Import your existing images...
>
> Point to a folder (or folders) that contain your
existing full-size and
> thumbnail image and Slide Show Magic will match them up
and add them to
> your slide show - unaltered and ready to view.
>
>
> Organize Images into sets
>
> Slide Show Magic enables you to define logical image
sets and organizes
> the thumbnail panel into navigable sets.
>
>
> Mix landscape and portrait orientations
>
> Your images are never distorted in any way. Original
aspect ratios are
> always preserved. Use both landscape and portrait images
in the same slide
> show.
>
>
> Deploy alone or inside existing layouts
>
> Slide Show Magic can be inserted on a page by itself or
inside an existing
> page.
>
>
> Select from 6 Themes
>
> Select a dark toolbar, a light toolbar, shadow boxes (in
3 sizes), or an
> image rotator interface. Style themes can even be
switched for existing
> slide shows.
>
>
> Manage it all inside a dedicated Dreamweaver Interface
>
> Add (append) new images
> Delete images or re-order them
> Manage Descriptions, links, and ALT text
> Edit existing full-size or Thumbnail images
> Reprocess all of your slide show's images
>
> And lots more, including a comprehensive manual and free
tech support.
> $95
>
> --
> Al Sparber - PVII
>
http://www.projectseven.com
> Extending Dreamweaver - Nav Systems | Galleries |
Widgets
> Authors: "42nd Street: Mastering the Art of CSS Design"
>
>
>
>

Problem with jquery slide show conflict with vertical navigation menu in Firefox & Chrome

Problem with jquery slide show conflict with vertical navigation menu in Firefox & Chrome. Works in IE. This is my first time trying to post a question - so please be kind. I am also not good with code and am finding css a real challenge after learning to design based on tables. I'm using CS5.
The "test" page with the slide show is: http://www.reardanwa.com/index-slides.html   The same page without the slide show is http://www.reardanwa.com/
I realize the images are not ideally sized - I'll fix those once I get the pages to function. Maybe I need a different slide show? I would prefer a widget that I can modify to required size & postition. Again - I'm not good at building with code from scratch.
The problem is the naviagation links that are directly next to the slide show do not work in Firefox of Chrome. They do work in IE.
I've read about using jQuery.noConflict(); code but can't figure out the correct way to use it in my case or whether that's even part of the solution. I know my code is not well organized as I have cobbled together from various sources in an attempt to format the page the way the client wants it. Also, FYI, I will eventually try to make the page work in Surreal CMS.
I've spent sevaral days over the last several weeks trying to solve sth slide show/navigation conflict - so any specific light you can shed will be much appreciated.
Thanks in advance.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Reardan Area Chamber of Commerce</title>
<meta name="description" content="home page for Reardan Area Chamber of Commerce" />
<meta name="keywords" content="Reardan WA, chamber of commerce" </>
<script src="scripts/jquery-1.6.min.js" type="text/javascript"></script>
<script src="scripts/jquery.cycle.all.js" type="text/javascript"> </script>
<script type="text/xml">
</script>
<style type="text/css">
                              #slideshow {
                                  padding: 10px;
                                        margin:0;
                              #slideshow-caption{
                                        padding:0;
                                        margin:0;
                              #slideshow img, #slideshow div {
                                  padding: 10px;
                                  background-color: #EEE;
                                  margin: 0;
body {
          font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
          background: #004B8D;
          margin: 0;
          padding: 0;
          color: #000;
/* ~~ 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. */
           /* 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. */
.left
position:absolute;
left:0px;
.center
margin:auto;
width:95%;
.box
          position:relative;
          left:-90px;
          width:950px;
          height:350px;
          border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
          z-index:1000;
.slide{
    position:absolute;
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: #42413C;
          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: #6E6C64;
          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;
/* ~~this fixed width container surrounds the other divs~~ */
.container {
          width: 960px;
          min-height:900px;
          padding:5px 0px 0px 0px;
          background: #E8F8FF;
          margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout */
/* ~~ 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: #E8F8FF;
          padding:10px 5px 0px 5px;
.sidebar1 {
          float: left;
          width: 225px;
          margin: 60px;
          color: #FFFF0D;
          background: #595FFF;
          border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
          padding: 5px 5px 0px 5px;
    border: 3px solid #F7F723;
    z-index:-1;
.sidebar2 {
          float: left;
          width: 275px;
          color: #FFFF0D;
          text-align: left;
          background: #595FFF;
          padding-bottom: 10px;
          border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
    border: 3px solid #F7F723;
    z-index:2;
.sidebar3 {
          float: left;
          width: 275px;
          color: #FFFF0D;
          text-align: left;
          background: #595FFF;
          padding-bottom: 10px;
          border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
    border: 3px solid #F7F723;
    z-index:3;
.content {
          padding: 0px 0px 0px 0px;
          width: 780px;
          float: left;
          background: #E8F8FF;
/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol {
          padding: 0px 15px 5px 10px; /* 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 navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
ul.nav {
          list-style: none; /* this removes the list marker */
          border-top: 0px solid #FFFF66; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
          margin-bottom: 50px; /* this creates the space between the navigation on the content below */
          font: Arial Black, Verdana, , Helvetica, sans-serif;
          font-size:1.3em;
          font-weight:bold;
          z-index:2;
ul.nav li {
          border-bottom: 0px solid #FFFF66; /* this creates the button separation */
          font: 120%/1.4 Arial Black, Verdana, , Helvetica, sans-serif;
ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
          padding: 3px 0px 5px 0px;
          display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
          width: 185px; /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
          text-decoration: none;
          color: #FFFF0D;
          background: #595FFF;
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
          background: #595FFF;
          font: 120%/1.4 Arial Black, Verdana, , Helvetica, sans-serif;
          color: #FFFFFF;
/* ~~ The footer ~~ */
.footer {
          padding: 10px 0;
          background: #595FFF;
          color: #FFFF0D;
          position: relative;/* this gives IE6 hasLayout to properly clear */
          clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
/* ~~ 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;
-->
</style>
</head>
<body>
<div class="container">
<div class="header">
<a href="#"><img src="images/Chamber-Logo-2.gif" alt="Reardan Chamber Logo" width="187" height="163" hspace="10" vspace="5" align="top" /></a><img src="images/Reardan-Chamber-Title.gif" width="476" height="204" alt="Reardan Area Chamber of Commerce, Dedicated to Preserving and Enhancing Area Businesses" /><p></p>
<p style="color: #F00">This Site is under construction! Please pardon our dust as we create!</p>
</div>
<div class="sidebar1">
    <ul class="nav">
      <li><a href="about.html">About Us</a></li>
      <li><a href="history.html">Reardan History</a></li>
      <li><a href="activities.html">Activities</a></li>
      <li><a href="business.html">Business<br />
        Directory</a></li>
      <li><a href="about.html">Join the<br />
        Chamber</a></li>
       <li><a href="links.html">Links<br />
  <span style="font-size: 85%">Tourism</span><br />
      </a></li>
    </ul>
     </div>
<br />
<br />
<br />
<br />
<div class="box" +"slide">
<script type="text/javascript">
// BeginOAWidget_Instance_2559022: #slideshow
                           slideshowAddCaption=true;
$(window).load(function() {
$('#slideshow').cycle({
                    after:                              slideshowOnCycleAfter, //the function that is triggered after each transition
                    autostop:                              false,     // true to end slideshow after X transitions (where X == slide count)
                    fx:                                        'blindX',// name of transition effect
                    pause:                              false,     // true to enable pause on hover
                    randomizeEffects:          true, // valid when multiple effects are used; true to make the effect sequence random
                    speed:                              100, // speed of the transition (any valid fx speed value)
                    sync:                              true,     // true if in/out transitions should occur simultaneously
                    timeout:                    5000, // milliseconds between slide transitions (0 to disable auto advance)
                    fit:                              true,
                    height:                       '300px',
                    width:         '525px'   // container width (if the 'fit' option is true, the slides will be set to this width as well)
function slideshowOnCycleAfter() {
          if (slideshowAddCaption==true){
                              $('#slideshow-caption').html(this.title);
// EndOAWidget_Instance_2559022
</script>
<div id="slideshow">
    
    <img src="images/100_1537.jpeg" width="600" height="450" title="caption for image1" /> <img src="images/Parade-2011-2.jpg" width="300" height="225" title="caption for image2" /> <img src="images/100_1495.jpeg" width="600" height="450" title="caption for image3" />
    <div title="sample title"> Images for slide show will need to be re-sized to fit box to avoid distortion</div>
    <img src="images/beach4.jpg" width="200" height="200" title="caption for image4" /> <img src="images/beach5.jpg" width="200" height="200" title="caption for image5" /> </div>

<div id="slideshow-caption"></div></div>
<div class="sidebar2" "anotherClass editable"><p align="center"><strong>Chamber News</strong><br />
Local News item
<br />
Another New item</p>
<p align="center">lots of news this week<br />
    <br />
    <br />
    <br />
</p>
</div>
<div class="sidebar3" "anotherClass editable"><p align="center"><strong>Upcoming Events</strong></p>
<div align="center">    <a href="activities.html" style="color: #FFFF0D">Community wide yard sales</a><br />
    <br />
    <br />
    <br />
    <br />
</div>
</div>
<div class="content"><br />
<br />
</div>
<div class="footer">
        <p align="center"><span style="font-size: small">Reardan Area Chamber of Commerce</span><br />
          <span style="font-size: x-small">[email protected] - 509.796.2102</span><br />
        </p>
        
</div></body>
</html>

If you DO want the slideshow overlaping the navigation try the below css:
.sidebar1 {
    float: left;
    width: 225px;
    margin: 60px 0px 60px 60px;
    color: #FFFF0D;
    background: #595FFF;
    border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
    padding: 5px 5px 0px 5px;
    border: 3px solid #F7F723;
.box {
float: left;
margin-left:-60px;
width:700px;
height:350px;
border-radius: 13px;
-moz-border-radius: 13px;
-webkit-border-radius: 13px;

Fuzzy slide show

Similar Messages

Maybe you are looking for