|
|
|
Sunday, 05 September 2010
|
Home Web Design and Code
|
Web Design and Code
|
Saturday, 17 February 2007 |
|
|
 |
To install Deluxe Menu you should place all menu .js files into any folder of your html project.
For example, it'll be menudir/ folder.
1. Paste the following code into a <head> tag of your page:
<!-- Deluxe Menu -->
<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a>
<script type="text/javascript">var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<!-- (c) 2007, http://deluxe-menu.com -->
2. Paste the following code where you want to have the menu:
<script type="text/javascript" src="menudir/data.js"></script>
Deluxe Tree has several funtional samples which help you to use the full functionality of this Javascript Tree Menu.
|
Standart Tree Menu
You can create standart floatable tree menu. In this sample you can see how to use lines. You can also add any html code within menu items.
|
|
Using Deluxe Tabs is a very space-saving way to present the information. Now you don't have got to puzzle over the problem how to design the page in the best way.
If you have a large volume of data and your page needs to be scrolled down too much - Deluxe Tabs is your choice! Just divide the information and distribute it among the tabs so that your visitors could reach the next piece of information with one single click. No more uncomfortable reading with scrolling! Various types of data can be placed on one page. So, your visitors need no more reload a large number of pages to find the information they want.
Deluxe Tabs will really lighten the process of site building as it allows to place much information within one page without creating many others. But for all that, all the information is parted and structured. You are free to create tabs containing text, images and practically all kinds of information in various combinations. You may also create any desirable design inside the tab with HTML. And you can add as many tabs as you wish!
|
 |
|
|
The template emulates tabs menu style like on the Kaspersky website. To switch between tabs click on the tab.
These are image-based tabs.
|
|
Test - BB2video - Chat Banner |
|
|
|
|
Test - BB2flash005 - iFrame |
|
|
|
|
Thursday, 15 February 2007 |
|
The above is a customized flash sample generated using Flash 8 and Dreamweaver. This sample can be fully customized with differing style drop-down Header and Caption, as well as the player bar can be custom to the site content style. The images can be replaced and links per image implemented. This type of header can be placed in content, right or left column, or in an upper or lower site module. A custom module class suffix can be designed and implemented so the flash slider will fit well with the site.
|
|
Thursday, 15 February 2007 |
|
|
|
Test - Install Flash Logo using JCE Media Manager |
|
|
|
|
Saturday, 03 February 2007 |
|
Here is another flash example which is tall and thin, and can be used in primarily a column location, but can also be embedded into content. I have placed some sample controls; however, there are many more. The audio can be different for each gallery image, or for the same for the entire gallery, like I have in this example. |
|
Saturday, 03 February 2007 |
|
The above is a customized flash sample generated using Flash 8 and Dreamweaver. This sample can be fully customized with differing style drop-down Header and Caption, as well as the player bar can be custom to the site content style. The images can be replaced and links per image implemented. This type of header can be placed in content, right or left column, or in an upper or lower site module. A custom module class suffix can be designed and implemented so the flash slider will fit well with the site.
|
|
Thursday, 25 January 2007 |
|
I have put a quick page together showing a Home Loan Calculator which
can be integrated into Joomla content or a module.
New Page - >> Click Here
Pop-Up Window - >> Click Here
|
|
|
Thursday, 25 January 2007 |
|
|
|
Tuesday, 31 October 2006 |
|
The first set of tabs includes js from Dynamic Drive. There is no mombat, and the input into contet box is quite difficult. The WYSIWYG will need to be turned off to create content. The CSS hase been messed with just a bit.
|
This is my dog Shep. Here he is in this photo posing for a picture. I think he really likes getting his picture taken.
|
I think I like the Flooble expansion box a bit more. It also does not have a module and requires the editor to be turned off.
| Flooble Expansion Box |
[+]
|
|
This is my dog Shep. Here he is in this photo posing for a picture. I think he really likes getting his picture taken.
|
The following tabs and slides are from JoomlaWorks. They have an integrated mombat and the editor can be on when inputing content.
|
This is my dog Shep. Here he is in this photo posing for a picture. I think he really likes getting his picture taken.
|
|
This is my dog Shep. Here he is posing under a big tree. I think he really likes getting his picture taken.
|
Photo effects are lightbox 2.0??
|
|
|
Monday, 30 October 2006 |
Fireworks.js is a bit of Javascript that creates star burst-type
explosions, which have to be seen to be believed. Exploding firework
animations are hot, the new black, the script equivalent of the blink
tag. Mmm, blink tag. Here, check it out FIREWORKS . I don't have much javascript on my site, but am always looking for something cool.
|
|
|
HTML to be 'Incrementally Evolved' |
|
|
|
|
Sunday, 29 October 2006 |
|
It has been decided that HTML is going to be incrementally updated, as the W3C believe that their efforts with XHTML are going unnoticed or unused by many websites out there. HTML is going to be worked on in parallel with XHTML (but with no dependencies), with the W3C trying to evolve HTML to a point where it's easier and logical for everybody to transition to XHTML. However, their work is still going to attempt to improve HTML in itself, with work on forms moving towards transitioning into XForms, but bearing in mind the work done by Webforms. In addition, the W3C's HTML validator is going to get improved, with Tim Berners-Lee wanting it to 'check (even) more stuff, be (even) more helpful, and prioritize carefully its errors, warning and mild chidings'. This looks like a nice step forward for the W3C, and will hopefully leave all the squabbling and procrastination behind.
|
|
|
Saturday, 21 October 2006 |
Template Layout using CSS and div Tags
Content Body
The following is a template layout which can be used
for many
purposes. It could be used as a primary template for setting up
web design layouts, or can be embedded within the layout as shown here
for formatting specific areas of your web site. This particular
example
is fluid; therefore, it will expand as you re-size your browser.
The right Sidebar Insert has a fixed width; therefore, it will not
expand.
The code for this template is shown
below. You may hit
the '+' button to expand the data box. Feel free to take
and use the code however you feel fit.
In coming days/weeks I will be adding additional
template layouts for
your
viewing and usage. They will include multiple colum, with left
and right areas, for adding menus and advertisement locations.
| Template Layout - Nested Code |
[+]
|
<html>
<head>
<title>obeoneweb.com : Template Layout Techniques - Nested: using CSS and div
Tags</title>
<style type="text/css"> @import "all.css";
.TL_nested {
margin:20px 20px 0px 20px;
}
#content_area {
border:1px dashed #CCCCCC;
background:#fff;
margin-bottom: 10px;
margin-top: 10px;
}
#content_area #sidebar_insert {
border-left:1px dotted #CCCCCC;
border-bottom:1px dotted #CCCCCC;
float:right;
width:200px;
background:#FBFBFB;
margin:0px 0px 10px 10px;
}
#content_area p, #sidebar_insert p,
#content_area h1, #sidebar_insert h1,
#content_area pre, #sidebar_insert pre {
margin:0px 10px 10px 10px;
}
#content_area h2, #sidebar_insert h2 {
margin:0px 10px 10px 10px;
}
#content_area p, #sidebar_insert p,#content_area pre, #sidebar_insert pre {
font: 11px Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
padding-top:0px;
color: #000000;
}
#content_area h1, #sidebar_insert h1 {
font: 16px Georgia, Times, serif;
font-weight: normal;
padding-top:10px;
color: #906700;
}
#sidebar_insert h2, #content_area h2 {
font: 14px Georgia, Times, serif;
font-weight: normal;
padding-top: 10px;
color: #6666CC;
}
#sidebar_insert p {
font:10px Verdana, Arial, Helvetica, sans-serif;
padding-top:0;
}
</style>
</head>
<body class="TL_nested">
<div id="content_area">
<div id="sidebar_insert">
<h2>Sidebar Insert</h2>
<p>In this area you can add additional text, images, buttons, and/or
menu items.</p>
<p><strong>Blog Categories<strong></strong></strong></p>
<p><a
xhref="http://obeoneweb.com/code-and-design-concepts/code-and- web-design-concepts/">Web
Design and Code</a><br />
<a xhref="http://obeoneweb.com/computer-technology/computer- technology/">Computer
Technology</a><br />
<a xhref="http://obeoneweb.com/advertising/ advertising/">Advertising</a><br />
<a
xhref="http://obeoneweb.com/travel-and- discussion/travel-and-discussion/">Travel
and Discussion</a></p>
</div>
<h1>Template Layout using CSS and div Tags</h1>
<h2>Content Body</h2>
<p>The following is a template layout which can be used
for many
purposes. It could be used as a primary template for setting up
web design layouts, or can be embedded within the layout as shown here
for formatting specific areas of your web site. This particular
example
is fluid; therefore, it will expand as you re-size your browser.
The right Sidebar Insert has a fixed width; therefore, it will not
expand.<br />
</p>
<p><strong>The code for this template is shown
below. Please hit
the read more button. Feel free to take
and use the code however you feel fit.</strong><br />
</p>
<p>In coming days/weeks I will be adding additional
template layouts for
your
viewing and usage. They will include multiple colum, with left
and right areas, for adding menus and advertisement locations.<br />
</p>
</div>
</body>
</html>
|
|
|
Top 10 Web Developer Libraries |
|
|
|
|
Monday, 18 September 2006 |
|
I decided to make a list of the top libraries that I have come
across or that I personally use. Libraries can be a web developers best
friend. They are great resources to learn from and can save hours and
hours of time. These libraries include JavaScript, Ajax, Colors, PHP,
and CSS. These should be in any web developers bookmarks, so go ahead
and look through these libraries and bookmark your favorite ones.
|
|
Read more...
|
|
|
Wednesday, 05 July 2006 |
|
Dynamic DNS Updating
Consider using this service if you are needing to access a server or VPN that has a secure interface and needs to know your IP address to allow access, but DO NOT install the third party software products that link to a Dynamic DNS service like this to keep your IP address current.
You are bound to have huge problems. We did this to access a friends server and have had nothing but problems, our computer won't wake up, our system crashes, and suddenly my network Internet access seems to be attached to my personal computer not the hub. If my computer is off no one on the network can access the Internet. I removed the program, but that has not been enough. I had even had to go in and alter the registry.
Learn from our headaches. Don't install the auto update DNS software, just go to the service online and manually update your DNS address.
|
|
|
blogging with CMS - Joomla |
|
|
|
|
Sunday, 18 June 2006 |
|
Blogs are great tools for quickly and easily publishing information to your viewing public.
Many pepole are now blogging, from personal use including children, to small and larger businesses. These include the entertainment, law, and medical businesses.
What is interesting, however, many are turning to platforms such as blogger or wordpress
without considering scalability. What I would like to offer here is the CMS based alternative of Joomla, which provides tremendous scalability while also offering full function blogging capabilities. CMS solutions are expandable as your interests grow, and can be fully developed into business opportunities.
|
|
|
Tuesday, 13 June 2006 |
|
The Markup Validation Service by the World Wide Web Consortium, W3C, allows internet users to check HTML documents for conformance to their HTML and XHTML standards. Although HTML files will render regardless of errors in major browsers,
they often contain many structure and/or form errors. The Markup
Validation Service is not only a good way to make sure documents
conform to standards, but is also a quick method to check for errors in
code.
It is important to have your web site code validate in order to assure compatibility. Sites with non-validating code can load slower, or not at all. You can follow the following two links to test both this site, as well as other site locations.
|
|
|
Tuesday, 13 June 2006 |
|
The following is a discussion of a basic topic, but one of quite significant importance to create a user friendly environment. It also is strange to be discussing a topic as basic as
“navigation” 11 years into the web era. And yet, if you’re a web
designer, chances are you’ve made some mistakes in this fundamental
area. I know I have. So let’s go back to basics.
On a website, “navigation” doesn’t mean just links. Navigation is,
like most elements of a website, about communicating with the user.
Good navigation tells a story, and good stories have a beginning,
middle, and end.
Navigation also has three parts, which are used to communicate to
the user about their past, present, and future. Any good global
navigation scheme should, at a glance, answer the top three questions
every user has at the back of their mind on any page:
- Where am I? (Present)
- Where can I go? (Future)
- Where have I been? (Past)
Here’s a test: Go to any random page on the internet. A deep page,
not a home page. Then see if you can answer all three of those
questions without looking at the URL
or mousing over links to see where they go. See if you can tell your
present, future, and past purely through visuals. Even in our brave new
Web 2.0 world, most sites fail.
This is where CMS excells?
A CMS system, such as Joomla, the one this web site was built on, offers a pathway feature which allows users the ability to see where the are, and where they have been. This pathway feature is also clickable, which allows the user to jump quickly back to a previous location. The following illustration shows the pathway feature in CMS...
|
|
Read more...
|
|
|
|
|
|
Newsflash |
|
Welcome to obeoneweb. This site was created to discuss topics
primarily related to web design and computer technology. It will be used as a database to collect information and
topics as well as pass specific items of interest on to the viewing
public.
|
|
|
Who's Online |
|
We have 1 guest online |
|