Making your very own website can be fun, educational, and give you something to show off to your friends. However, adding certain features to your site like centering all of the content or embedding a movie/game can be a little tricky.
This post will be continuously updated with useful code, tips, and website references that will help you make your website everything you want it to be.
----------------------------------------------------------------------------------------------------------------------------------
1) News Reel:
-A useful feature for any website is a news reel. This can be used to say 'Hi' to friends, inform people of important updates, and even contain links to other sites. The best free news reel code I have found would be the 'Scrolling News Ticker' by Mioplanet.
http://www.mioplanet.com/rsc/newsticker_javascript.htm
-This news reel has a VERY smooth glide from right to left, and can be customized easily by following the directions on their page.
-Here is an exampe of how the news reel can be used: www.trisolate.com
----------------------------------------------------------------------------------------------------------------------------------
2) Center your Content:
-If you are having problems making your website content appear in the center of the page, you can create a simple class that centers the content for any size browser window. This means that for any resolution, or browser window size, your website content will sit at the dead center of your window.
-This code was found on: http://www.dreamweaverclub.com/css-center-content.php
-This is a website that is currently using this code: www.trisolate.com
-To create this class, add the following code to each page that you want centered:
THE HTML:
<body>
<div class="wrapper"> all content goes here </div>
</body>
THE CSS:
body {
text-align : center ;
min-width : 770px ;
}
div.wrapper {
width : 770px ;
text-align : left ;
margin-left : auto ;
margin-right : auto ;
position : relative ;
}
----------------------------------------------------------------------------------------------------------------------------------
3) Embed a Flash Game (swf file) or a YouTube Video
-Some websites, like youtube.com and http://www.addictinggames.com/embeddable-games/index.jsp will allow you to put their games and videos on your site by providing you with an embed code. The embed code will make the video or game show up wherever you put the code on your webpage. The easiest way to work with an embed code is to put it in a Div Tag, that way you can move the game or video wherever you want.
-Here is an example embed code from: http://www.addictinggames.com/embeddable-games/index.jsp
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" id="gameObject" width="550" height="400"><param name="movie" value="/newGames/action-games/tank2010/tank2010_w.swf"/><param name="menu" value="false"/><param name="allowscriptaccess" value="always"/><param name="allownetworking" value="all"/><embed src="/newGames/action-games/tank2010/tank2010_w.swf" width="550" height="400" menu="false" allowscriptaccess="always" allownetworking="all" name="gameObject" type="application/x-shockwave- flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object><span style="font- size:11px;"><br/><a href="" style="font-size:11px;">Games</a>:<a href="http://www.addictinggames.com/action-games/index.jsp" style="font-size:11px;">Play Action Games on AddictingGames</a><br/><a href="http://www.addictinggames.com/legal/terms-use.jsp" style="font- size:11px;">Terms of Use</a> | <a href="http://www.addictinggames.com/legal/copyright.jsp" style="font- size:11px;">© 2011 Atom Entertainment, Inc., a subsidiary of Viacom International Inc. All Rights Reserved.</a></span>
-Here is an example embed code from: www.youtube.com
<iframe width="560" height="315" src="http://www.youtube.com/embed/2sWWoDGOSQU?rel=0" frameborder="0" allowfullscreen></iframe>
-And finally, this is what an embedded video looks like: http://trisolate.com/HoneyBeesWaxMoths.html
----------------------------------------------------------------------------------------------------------------------------------
No comments:
Post a Comment