I’m sure plenty of you have seen this before as I know I have been using it for a long time but nether the less I thought I would post it anyway.
Jonathan Snook has created a very handy visual representation for the Prototype Framework. It’s an amazingly useful tool to have whilst developing and I recommend it to anyone that wishes to use Prototype.
Anyway here is Snook’s Prototype Diagram. Enjoy!
Whilst looking for some Visio templates and Stencils I came across a nice implementation of a JavaScript Carousel. It’s pretty slick and is based on the Yahoo User Interface (YUI) library.
Have a look for yourself at Bill Scotts Carousel.
A need to start off by thanking Heather who very kindly reworked the Sexy Sliding Menu to work from the left hand side and here it is.
There arent many changes here from the original in fact the only change within the HTML was to move the tab after the tab content region so as to align the tab on the right hand side of the content.
The CSS again also did not require a great deal of modification. The main changes were to absolutely position the tab and its contents to the left hand side and repositioning the contents background image.
Simple image amends were made and can be found in the download at the bottom of this article.
body{
font-size:75%;
}
a{
outline: none;
}
a:active{
outline: none;
}
#sideBar{
text-align:left;
}
#sideBar h2{
color:#FFFFFF;
font-size:110%;
font-family:arial;
margin:10px 10px 10px 10px;
font-weight:bold !important;
}
#sideBar h2 span{
font-size:125%;
font-weight:normal !important;
}
#sideBar ul{
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
}
#sideBar li{
margin:0px 10px 3px 10px;
padding:2px;
list-style-type:none;
display:block;
background-color:#DA1074;
width:177px;
color:#FFFFFF;
}
#sideBar li a{
width:100%;
}
#sideBar li a:link,
#sideBar li a:visited{
color:#FFFFFF;
font-family:verdana;
font-size:100%;
text-decoration:none;
display:block;
margin:0px 0px 0px 0px;
padding:0px;
width:100%;
}
#sideBar li a:hover{
color:#FFFFFF;
text-decoration:underline;
}
#sideBar{
position: absolute;
width: auto;
height: auto;
top: 140px;
left:0px;
background-image:url(images/background-left.gif);
background-position:top right;
background-repeat:repeat-y;
}
#sideBarTab{
float:left;
height:137px;
width:28px;
}
#sideBarTab img{
border:0px solid #FFFFFF;
}
#sideBarContents{
float:left;
overflow:hidden !important;
width:200px;
height:320px;
}
#sideBarContentsInner{
width:200px;
}
</style>
Please have a look at the Sliding Menu Revisited demo.
Please have a look at the Sliding Menu Revisited code.
Hope this helps enjoy!
Well I’ve been at it again looking at new ways in which I can make good use script.aculo.us effects. I started by looking at the accordion this time and ways in which it can be developed to produce different results. The most common example that I knew of was the Rico accordion, so that’s where I decided to start.
As you can see below it looks quite cool and can add some nice interaction to any site. At this stage, however, I’m not going to write too much about the code behind it as I am still working on it but I thought it may be interesting for people to have a look at.
Currently the tab slide has been tested in Fixefox 2.0, Internet Explorer 7 – 6, Opera 9 and Safari 3. I am planning to test this more rigorously, however, as I stated above there is still more work required before I prepared to say it is complete.
Please use the Fancy Sliding Tab Menu using scipt.aculo.us demo, have a play and let me know what you think.
Please download Fancy Sliding Tab Menu using scipt.aculo.us code and use it to your hearts desire.
It is very frustrating from time to time when you find other sites that have plagiarised your content. I regularly check my site statistics and can therefore see sites that for example hotlink to my images and so I have a quick look.
Now some people reference content properly stating where they got the content from and others don’t. It is the people that don’t that need to be shamed.
I recently stumbled upon a site called Van2T (http://www.designvietnam.net/vantt/) as they had properly linked to my article Sexy sliding JavaScript side bar menu using mootools. See http://www.designvietnam.net/vantt/?p=8.
However when browsing the site I found two articles that looked very similar to my content. Have a look at Top 15 free and open source web developer tools updated, 15 must have web developer tools for beginners, Top 15 free and open source PHP development tools and Script of the week, then have a look and browse around Van2T and make up your own mind.
I would just like to say that I don’t mind in general people using my content, however, it should always be reference back to my site and an email never hurts.
Anyway. Rant over… 
