Saturday, February 26, 2011

javascript and jquery slide shows

I am working on a slideshow for Traditions Home. The prototype can be found on many site, but I am using Stickley's Collector Piece 2011 as an example.

The elements are as follows:

1. The unordered list.

2. The css that styles the list.

3. Three jquery js files that allow for the sliding of the thumbnails and then for the larger images to be revealed when clicking on the thumbnail.

The javascript is from lightbox and the use of this code permits the display of large images.The lightbox website and the download code is available.

4. Two separate folders for images are needed. One for the thumbnails, one for the larger images. The thumbnail images are sized 150 x 175 pixels.The larger images are a big 1000 x 600 pixels.

Friday, February 25, 2011

Deadline Hollywood

Great blogs are always changing things up. Deadline Hollywood is the hottest property in the entertainment industry. This is a result of both its biting commentary and its super charged layout. Let's see if we can uncover a few of the secrets of the layout.

Body.

Nothing special here.The margin and padding properties are set to 0. A couple of other housekeeping functions are set. The background color is set to #421010, a dark purple.

Container

Deadline calls the container "core" and sets the width to 1000px. The container is then centered using the standard css - 0 auto, 20px auto. The background color of the core is set to #370b0a, a lighter shade of the body color.

Header

The header contains several key elements. The first is the top menu called the masthead, which is an unordered list. A second element contains the editor's name, Nikki Finke.

I'll be back. Gotta go to work.

Saturday, February 12, 2011

Video 2

This is where I am at on video editing and uploading to my site: I get videos from Media Partners in a MOV format.

I am not editing the commercials myself yet.

I can uplaod the MOV video to youtube directly.

Then, I can go to KeepVid.com and convert the format to either an MPeg4 or FLV format.The FLV format is preferred because I can then insert this directly into the website using Dreamweavers Insert Media.

Let's test this on Traditions Furniture.

Thursday, February 3, 2011

Video upload to Youtube

I have been putting this off for awhile. That is converting wmv files to mpeg-4 and then uploading videos to Youtube. Events keep moving on and now, I find that the wmv videos on my website won't play because of changes in internet securtity, the time to learn has arrived.

This article will seem a little fractured. That's because I don't fully grasp everything yet. But, step one is learning about Windows Media Player. Here is a good tutorial on how to capture and edit video and then post it to Youtube.

In Windows Vista Movie Maker is found in Programs > Windows Movie Maker.




The next step will be actually making a video. This can be done with simple images. Microsoft has a pdf showing how to do this. ...

Wednesday, December 15, 2010

Surviving a Teacher's Salary

Cute is an understatement. The website Surviving a Teacher's Salary is a great example of color, content, and organization. The design elements are contained in the css which is old style, that is, it is contained in the page itself.

The body has a background image.

The header-wrapper also has a background image. The width is 960pixels and is centered on the body background image by use of the 0 auto margins.Here is the css:

#header-wrapper {
background-image:url(http://www.leeloublogsimages.com/Layouts/2010/Schoolzone/SchoolZoneHead.png);background-position: top center; background-repeat:no-repeat;
width:960px;
height:400px;
margin-right:0px;
border-bottom: 0px solid #fdd9aa;
}

I have to go and I will come back to this.

Tuesday, August 24, 2010

Box Shadows with CS3

Fetchak gives a work around to allow box shadows; found at http://fetchak.com/ie-css3/. The example also rounds corners.

Mozilla has also posted this information at its Development Center. The information there is more detailed and six live examples are given.

Remember CSS is placed either in the head or directly into the element tag. The obvious advantage of putting the Blogger CSS in the head tag is that the css can be repeatedly applied to a class of elements. For purposes of this example, I put the CSS Here is the css:

.box {
  -moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari and Chrome */
  border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */

  -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
  -webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
  box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */

  behavior: url(ie-css3.htc); /* This lets IE know to call the script on all elements which get the 'box' class */
}
Let's see if it works.

First, I create a div with a class name "box". I then put the css into the element tag using style. (I am going to put the css into the layout when this works.) You will see that I added color to the background and the text, then changed the width, height and padding to make the box stand out.


Learn how to put a box shadow on a div in blogger

Wednesday, August 11, 2010

blog wars

The blogoshpere has changed much since I started blogging. Blogger, which ruled the platform in the beginning, finds stiff competition from WordPress and now DotNetNuke. While Blogger maintains an advantage in simplicity, WordPress and DotNetNuke offer hosting advantages that the serious blogger will want to take advantage of.

In February 2008 Michael Kizer made the switch from WordPress to NetDotNuke.You can read his posting  to read his thoughts on why the switch.However, his blog postings end in October 2009, which makes me wonder. Did he loose interest in NetDotNuke or just run out of thoughts on the remodel project that was the subject of the blog? And, if buzz on the internet determines popularity, then the new kid on the block, NetDotNuke, is not quite ready for prime time.

LinkedIn gives a thumbs up rating to WordPress.The big advantage of WordPress over Blogger is explained like this:

Wordpress.org is not only a platform for blogging (I run two blogs with it), it can be used as a Web site with or without a blog (I also am starting a new Website and Blog with it for my daughter). There are many free Wordpress themes to run blogs with thousands of developers offering plugins (Widgets - add ons) for almost anything imaginable. 
NetDotNuke may have and advantage in skins available for showing off your blog, but WordPress has an advantage over NetDotNuke in simplicity and add ons.

Of course, if simplicity is all that you are after, then Blogger can not be beat. Blogger is a good beginning tool. It also permits multiple blogs and a dashboard that allows the blogger to jump back and forth between blogs with the touch of a key.