Merge branch 'master' of https://github.com/Eiffel-World/EiffelWebNino
This commit is contained in:
Jocelyn Fiat
@@ -1,44 +1,44 @@
|
|||||||
note
|
note
|
||||||
description : "nino application root class"
|
description : "nino application root class"
|
||||||
date : "$Date$"
|
date : "$Date$"
|
||||||
revision : "$Revision$"
|
revision : "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
APPLICATION
|
APPLICATION
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
ARGUMENTS
|
ARGUMENTS
|
||||||
|
|
||||||
HTTP_SERVER_SHARED_CONFIGURATION
|
HTTP_SERVER_SHARED_CONFIGURATION
|
||||||
|
|
||||||
create
|
create
|
||||||
make
|
make
|
||||||
|
|
||||||
feature {NONE} -- Initialization
|
feature {NONE} -- Initialization
|
||||||
|
|
||||||
make
|
make
|
||||||
-- Run application.
|
-- Run application.
|
||||||
local
|
local
|
||||||
l_server : HTTP_SERVER
|
l_server : HTTP_SERVER
|
||||||
l_cfg: HTTP_SERVER_CONFIGURATION
|
l_cfg: HTTP_SERVER_CONFIGURATION
|
||||||
l_http_handler : HTTP_HANDLER
|
l_http_handler : HTTP_HANDLER
|
||||||
do
|
do
|
||||||
create l_cfg.make
|
create l_cfg.make
|
||||||
l_cfg.http_server_port := 9_000
|
l_cfg.http_server_port := 9_000
|
||||||
l_cfg.document_root := default_document_root
|
l_cfg.document_root := default_document_root
|
||||||
set_server_configuration (l_cfg)
|
set_server_configuration (l_cfg)
|
||||||
debug ("nino")
|
debug ("nino")
|
||||||
l_cfg.set_is_verbose (True)
|
l_cfg.set_is_verbose (True)
|
||||||
end
|
end
|
||||||
|
|
||||||
create l_server.make (l_cfg)
|
create l_server.make (l_cfg)
|
||||||
create {APPLICATION_CONNECTION_HANDLER} l_http_handler.make (l_server)
|
create {APPLICATION_CONNECTION_HANDLER} l_http_handler.make (l_server)
|
||||||
l_server.setup (l_http_handler)
|
l_server.setup (l_http_handler)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Access
|
feature -- Access
|
||||||
|
|
||||||
default_document_root: STRING = "webroot"
|
default_document_root: STRING = "webroot"
|
||||||
|
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|||||||
@@ -1,115 +1,115 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {HEAD_REQUEST_HANDLER}."
|
description: "Summary description for {HEAD_REQUEST_HANDLER}."
|
||||||
author: ""
|
author: ""
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
HEAD_REQUEST_HANDLER
|
HEAD_REQUEST_HANDLER
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
|
|
||||||
SHARED_DOCUMENT_ROOT
|
SHARED_DOCUMENT_ROOT
|
||||||
|
|
||||||
SHARED_URI_CONTENTS_TYPES
|
SHARED_URI_CONTENTS_TYPES
|
||||||
|
|
||||||
HTTP_REQUEST_HANDLER
|
HTTP_REQUEST_HANDLER
|
||||||
|
|
||||||
HTTP_CONSTANTS
|
HTTP_CONSTANTS
|
||||||
|
|
||||||
feature
|
feature
|
||||||
|
|
||||||
|
|
||||||
process
|
process
|
||||||
-- process the request and create an answer
|
-- process the request and create an answer
|
||||||
local
|
local
|
||||||
fname: STRING
|
fname: STRING
|
||||||
f: RAW_FILE
|
f: RAW_FILE
|
||||||
ctype, extension: STRING
|
ctype, extension: STRING
|
||||||
do
|
do
|
||||||
fname := document_root_cell.item.twin
|
fname := document_root_cell.item.twin
|
||||||
fname.append (request_uri)
|
fname.append (request_uri)
|
||||||
debug
|
debug
|
||||||
print ("URI name: " + fname )
|
print ("URI name: " + fname )
|
||||||
end
|
end
|
||||||
create f.make (fname)
|
create f.make (fname)
|
||||||
create answer.make
|
create answer.make
|
||||||
if f.exists then
|
if f.exists then
|
||||||
extension := ct_table.extension (request_uri)
|
extension := ct_table.extension (request_uri)
|
||||||
ctype := ct_table.content_types.item (extension)
|
ctype := ct_table.content_types.item (extension)
|
||||||
-- TODO: This code could be improved to avoid string
|
-- TODO: This code could be improved to avoid string
|
||||||
-- comparisons
|
-- comparisons
|
||||||
if ctype = Void then
|
if ctype = Void then
|
||||||
process_default
|
process_default
|
||||||
answer.set_content_type ("text/html")
|
answer.set_content_type ("text/html")
|
||||||
else
|
else
|
||||||
if ctype.is_equal ("text/html") then
|
if ctype.is_equal ("text/html") then
|
||||||
process_text_file (f)
|
process_text_file (f)
|
||||||
else
|
else
|
||||||
process_raw_file (f)
|
process_raw_file (f)
|
||||||
end
|
end
|
||||||
answer.set_content_type (ctype)
|
answer.set_content_type (ctype)
|
||||||
end
|
end
|
||||||
else
|
else
|
||||||
answer.set_status_code (not_found)
|
answer.set_status_code (not_found)
|
||||||
answer.set_reason_phrase (not_found_message)
|
answer.set_reason_phrase (not_found_message)
|
||||||
answer.set_reply_text ("Not found on this server%N%R")
|
answer.set_reply_text ("Not found on this server%N%R")
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
process_default
|
process_default
|
||||||
--
|
--
|
||||||
local
|
local
|
||||||
html : STRING
|
html : STRING
|
||||||
do
|
do
|
||||||
answer.set_reply_text ("")
|
answer.set_reply_text ("")
|
||||||
html := " <html> <head> <title> Micro HTTPD </title> " +
|
html := " <html> <head> <title> Micro HTTPD </title> " +
|
||||||
" </head> " +
|
" </head> " +
|
||||||
" <body> " +
|
" <body> " +
|
||||||
" <h1> Welcome to Micro HTTPD! </h1> "+
|
" <h1> Welcome to Micro HTTPD! </h1> "+
|
||||||
" <p> Default page " +
|
" <p> Default page " +
|
||||||
|
|
||||||
" </p> " +
|
" </p> " +
|
||||||
" </body> " +
|
" </body> " +
|
||||||
" </html> "
|
" </html> "
|
||||||
answer.append_reply_text (html)
|
answer.append_reply_text (html)
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|
||||||
process_text_file (f: FILE)
|
process_text_file (f: FILE)
|
||||||
-- send a text file reply
|
-- send a text file reply
|
||||||
require
|
require
|
||||||
valid_f: f /= Void
|
valid_f: f /= Void
|
||||||
do
|
do
|
||||||
f.open_read
|
f.open_read
|
||||||
from
|
from
|
||||||
answer.set_reply_text ("")
|
answer.set_reply_text ("")
|
||||||
f.read_line
|
f.read_line
|
||||||
until f.end_of_file
|
until f.end_of_file
|
||||||
loop
|
loop
|
||||||
answer.append_reply_text (f.last_string)
|
answer.append_reply_text (f.last_string)
|
||||||
answer.append_reply_text (crlf)
|
answer.append_reply_text (crlf)
|
||||||
f.read_line
|
f.read_line
|
||||||
end
|
end
|
||||||
f.close
|
f.close
|
||||||
end
|
end
|
||||||
|
|
||||||
process_raw_file (f: FILE)
|
process_raw_file (f: FILE)
|
||||||
-- send a raw file reply
|
-- send a raw file reply
|
||||||
require
|
require
|
||||||
valid_f: f /= Void
|
valid_f: f /= Void
|
||||||
do
|
do
|
||||||
-- this is not quite right....
|
-- this is not quite right....
|
||||||
f.open_read
|
f.open_read
|
||||||
from
|
from
|
||||||
answer.set_reply_text ("")
|
answer.set_reply_text ("")
|
||||||
until f.end_of_file
|
until f.end_of_file
|
||||||
loop
|
loop
|
||||||
f.read_stream (1024)
|
f.read_stream (1024)
|
||||||
answer.append_reply_text (f.last_string)
|
answer.append_reply_text (f.last_string)
|
||||||
end
|
end
|
||||||
f.close
|
f.close
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,53 +1,53 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {POST_REQUEST_HANDLER}."
|
description: "Summary description for {POST_REQUEST_HANDLER}."
|
||||||
author: ""
|
author: ""
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
POST_REQUEST_HANDLER
|
POST_REQUEST_HANDLER
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
GET_REQUEST_HANDLER
|
GET_REQUEST_HANDLER
|
||||||
redefine
|
redefine
|
||||||
process
|
process
|
||||||
end
|
end
|
||||||
|
|
||||||
create
|
create
|
||||||
make
|
make
|
||||||
|
|
||||||
feature -- Execution
|
feature -- Execution
|
||||||
|
|
||||||
process
|
process
|
||||||
-- process the request and create an answer
|
-- process the request and create an answer
|
||||||
local
|
local
|
||||||
l_data: STRING
|
l_data: STRING
|
||||||
s: detachable STRING
|
s: detachable STRING
|
||||||
n: INTEGER
|
n: INTEGER
|
||||||
sock: like socket
|
sock: like socket
|
||||||
do
|
do
|
||||||
from
|
from
|
||||||
n := 1_024
|
n := 1_024
|
||||||
sock := socket
|
sock := socket
|
||||||
if sock.socket_ok then
|
if sock.socket_ok then
|
||||||
sock.read_stream_thread_aware (n)
|
sock.read_stream_thread_aware (n)
|
||||||
s := sock.last_string
|
s := sock.last_string
|
||||||
else
|
else
|
||||||
s := Void
|
s := Void
|
||||||
end
|
end
|
||||||
create l_data.make_empty
|
create l_data.make_empty
|
||||||
until
|
until
|
||||||
s = Void or else s.count < n
|
s = Void or else s.count < n
|
||||||
loop
|
loop
|
||||||
l_data.append_string (s)
|
l_data.append_string (s)
|
||||||
if sock.socket_ok then
|
if sock.socket_ok then
|
||||||
sock.read_stream_thread_aware (n)
|
sock.read_stream_thread_aware (n)
|
||||||
s := sock.last_string
|
s := sock.last_string
|
||||||
else
|
else
|
||||||
s := Void
|
s := Void
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
Precursor
|
Precursor
|
||||||
end
|
end
|
||||||
|
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,91 +1,91 @@
|
|||||||
1.4.2
|
1.4.2
|
||||||
[Feature]
|
[Feature]
|
||||||
- The plugin support percentages as target ('50%' or {top:'50%', left:'45%'})
|
- The plugin support percentages as target ('50%' or {top:'50%', left:'45%'})
|
||||||
- Exposed the max() calculation as $.scrollTo.max
|
- Exposed the max() calculation as $.scrollTo.max
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Renamed $.fn.scrollable to $.fn._scrollable to avoid conflicts with other plugins
|
- Renamed $.fn.scrollable to $.fn._scrollable to avoid conflicts with other plugins
|
||||||
[Fix]
|
[Fix]
|
||||||
- Fixing max calculations for regular DOM elements
|
- Fixing max calculations for regular DOM elements
|
||||||
|
|
||||||
1.4.1
|
1.4.1
|
||||||
[Feature]
|
[Feature]
|
||||||
- The target can be 'max' to scroll to the end while keeping it elegant.
|
- The target can be 'max' to scroll to the end while keeping it elegant.
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Default duration is 0 for jquery +1.3. Means sync animation
|
- Default duration is 0 for jquery +1.3. Means sync animation
|
||||||
- The plugin works on all major browsers, on compat & quirks modes, including iframes.
|
- The plugin works on all major browsers, on compat & quirks modes, including iframes.
|
||||||
- In addition to window/document, if html or body are received, the plugin will choose the right one.
|
- In addition to window/document, if html or body are received, the plugin will choose the right one.
|
||||||
[Fix]
|
[Fix]
|
||||||
- The plugin accepts floating numbers, Thanks Ramin
|
- The plugin accepts floating numbers, Thanks Ramin
|
||||||
- Using jQuery.nodeName where neccessary so that this works on xml+xhtml
|
- Using jQuery.nodeName where neccessary so that this works on xml+xhtml
|
||||||
- The max() internal function wasn't completely accurrate, now it is 98% (except for IE on quirks mode and it's not too noticeable).
|
- The max() internal function wasn't completely accurrate, now it is 98% (except for IE on quirks mode and it's not too noticeable).
|
||||||
|
|
||||||
1.4
|
1.4
|
||||||
[Fix]
|
[Fix]
|
||||||
- Fixed the problem when scrolling the window to absolute positioned elements on Safari.
|
- Fixed the problem when scrolling the window to absolute positioned elements on Safari.
|
||||||
- Fixed the problem on Opera 9.5 when scrolling the window. That it always scrolls to 0.
|
- Fixed the problem on Opera 9.5 when scrolling the window. That it always scrolls to 0.
|
||||||
[Feature]
|
[Feature]
|
||||||
- Added the settings object as 2nd argument to the onAfter callback.
|
- Added the settings object as 2nd argument to the onAfter callback.
|
||||||
- The 3rd argument of scrollTo can be just a function and it's used as the onAfter.
|
- The 3rd argument of scrollTo can be just a function and it's used as the onAfter.
|
||||||
- Added full support for iframes (even max scroll calculation).
|
- Added full support for iframes (even max scroll calculation).
|
||||||
- Instead of $.scrollTo, $(window).scrollTo() and $(document).scrollTo() can be used.
|
- Instead of $.scrollTo, $(window).scrollTo() and $(document).scrollTo() can be used.
|
||||||
- Added $().scrollable() that returns the real element to scroll, f.e: $(window).scrollable() == [body|html], works for iframes.
|
- Added $().scrollable() that returns the real element to scroll, f.e: $(window).scrollable() == [body|html], works for iframes.
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Cleaned the code a bit, specially the comments
|
- Cleaned the code a bit, specially the comments
|
||||||
|
|
||||||
1.3.3
|
1.3.3
|
||||||
[Change]
|
[Change]
|
||||||
- Changed the licensing from GPL to GPL+MIT.
|
- Changed the licensing from GPL to GPL+MIT.
|
||||||
|
|
||||||
1.3.2
|
1.3.2
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Small improvements to make the code shorter.
|
- Small improvements to make the code shorter.
|
||||||
[Change]
|
[Change]
|
||||||
- Removed the last argument received by onAfter as it was the same as the 'this' but jqueryfied.
|
- Removed the last argument received by onAfter as it was the same as the 'this' but jqueryfied.
|
||||||
|
|
||||||
1.3.1
|
1.3.1
|
||||||
[Feature]
|
[Feature]
|
||||||
- Exposed $.scrollTo.window() to get the element that needs to be animated, to scroll the window.
|
- Exposed $.scrollTo.window() to get the element that needs to be animated, to scroll the window.
|
||||||
- Added option 'over'.
|
- Added option 'over'.
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Made the code as short as possible.
|
- Made the code as short as possible.
|
||||||
[Change]
|
[Change]
|
||||||
- Changed the arguments received by onAfter
|
- Changed the arguments received by onAfter
|
||||||
|
|
||||||
1.3
|
1.3
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Added semicolon to the start, for safe file concatenation
|
- Added semicolon to the start, for safe file concatenation
|
||||||
- Added a limit check, values below 0 or over the maximum are fixed.
|
- Added a limit check, values below 0 or over the maximum are fixed.
|
||||||
- Now it should work faster, only one of html or body go through all the processing, instead of both for all browsers.
|
- Now it should work faster, only one of html or body go through all the processing, instead of both for all browsers.
|
||||||
[Fix]
|
[Fix]
|
||||||
- Fixed the behavior for Opera, which seemed to react to both changes on <html> and <body>.
|
- Fixed the behavior for Opera, which seemed to react to both changes on <html> and <body>.
|
||||||
- The border is also reduced, when 'margin' is set to true.
|
- The border is also reduced, when 'margin' is set to true.
|
||||||
[Change]
|
[Change]
|
||||||
- The option speed has been renamed to duration.
|
- The option speed has been renamed to duration.
|
||||||
[Feature]
|
[Feature]
|
||||||
- The duration can be specified with a number as 2nd argument, and the rest of the settings as the third ( like $().animate )
|
- The duration can be specified with a number as 2nd argument, and the rest of the settings as the third ( like $().animate )
|
||||||
- Remade the demo
|
- Remade the demo
|
||||||
|
|
||||||
1.2.4
|
1.2.4
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- The target can be in the form of { top:x, left:y } allowing different position for each axis.
|
- The target can be in the form of { top:x, left:y } allowing different position for each axis.
|
||||||
[Feature]
|
[Feature]
|
||||||
- The option 'offset' has been added, to scroll behind or past the target. Can be a number(both axes) or { top:x, left:y }.
|
- The option 'offset' has been added, to scroll behind or past the target. Can be a number(both axes) or { top:x, left:y }.
|
||||||
|
|
||||||
1.2.3
|
1.2.3
|
||||||
[Feature]
|
[Feature]
|
||||||
- Exposed the defaults.
|
- Exposed the defaults.
|
||||||
[Enhancement]
|
[Enhancement]
|
||||||
- Made the callback functions receive more parameters.
|
- Made the callback functions receive more parameters.
|
||||||
|
|
||||||
1.2.2
|
1.2.2
|
||||||
[Fix]
|
[Fix]
|
||||||
- Fixed a bug, I didn't have to add the scrolled amount if it was body or html.
|
- Fixed a bug, I didn't have to add the scrolled amount if it was body or html.
|
||||||
|
|
||||||
1.2
|
1.2
|
||||||
[Change]
|
[Change]
|
||||||
- The option 'onafter' is now called 'onAfter'.
|
- The option 'onafter' is now called 'onAfter'.
|
||||||
[Feature]
|
[Feature]
|
||||||
- Two axes can be scrolled together, this is set with the option 'axis'.
|
- Two axes can be scrolled together, this is set with the option 'axis'.
|
||||||
- In case 2 axes are chosen, the scrolling can be queued: one scrolls, and then the other.
|
- In case 2 axes are chosen, the scrolling can be queued: one scrolls, and then the other.
|
||||||
- There's an intermediary event, 'onAfterFirst' called in case the axes are queued, after the first ends.
|
- There's an intermediary event, 'onAfterFirst' called in case the axes are queued, after the first ends.
|
||||||
- If the option 'margin' is set to true, the plugin will take in account, the margin of the target(no use if target is a value).
|
- If the option 'margin' is set to true, the plugin will take in account, the margin of the target(no use if target is a value).
|
||||||
@@ -1,11 +1,11 @@
|
|||||||
/**
|
/**
|
||||||
* jQuery.ScrollTo - Easy element scrolling using jQuery.
|
* jQuery.ScrollTo - Easy element scrolling using jQuery.
|
||||||
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
|
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
|
||||||
* Dual licensed under MIT and GPL.
|
* Dual licensed under MIT and GPL.
|
||||||
* Date: 5/25/2009
|
* Date: 5/25/2009
|
||||||
* @author Ariel Flesler
|
* @author Ariel Flesler
|
||||||
* @version 1.4.2
|
* @version 1.4.2
|
||||||
*
|
*
|
||||||
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
|
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
|
||||||
*/
|
*/
|
||||||
;(function(d){var k=d.scrollTo=function(a,i,e){d(window).scrollTo(a,i,e)};k.defaults={axis:'xy',duration:parseFloat(d.fn.jquery)>=1.3?0:1};k.window=function(a){return d(window)._scrollable()};d.fn._scrollable=function(){return this.map(function(){var a=this,i=!a.nodeName||d.inArray(a.nodeName.toLowerCase(),['iframe','#document','html','body'])!=-1;if(!i)return a;var e=(a.contentWindow||a).document||a.ownerDocument||a;return d.browser.safari||e.compatMode=='BackCompat'?e.body:e.documentElement})};d.fn.scrollTo=function(n,j,b){if(typeof j=='object'){b=j;j=0}if(typeof b=='function')b={onAfter:b};if(n=='max')n=9e9;b=d.extend({},k.defaults,b);j=j||b.speed||b.duration;b.queue=b.queue&&b.axis.length>1;if(b.queue)j/=2;b.offset=p(b.offset);b.over=p(b.over);return this._scrollable().each(function(){var q=this,r=d(q),f=n,s,g={},u=r.is('html,body');switch(typeof f){case'number':case'string':if(/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(f)){f=p(f);break}f=d(f,this);case'object':if(f.is||f.style)s=(f=d(f)).offset()}d.each(b.axis.split(''),function(a,i){var e=i=='x'?'Left':'Top',h=e.toLowerCase(),c='scroll'+e,l=q[c],m=k.max(q,i);if(s){g[c]=s[h]+(u?0:l-r.offset()[h]);if(b.margin){g[c]-=parseInt(f.css('margin'+e))||0;g[c]-=parseInt(f.css('border'+e+'Width'))||0}g[c]+=b.offset[h]||0;if(b.over[h])g[c]+=f[i=='x'?'width':'height']()*b.over[h]}else{var o=f[h];g[c]=o.slice&&o.slice(-1)=='%'?parseFloat(o)/100*m:o}if(/^\d+$/.test(g[c]))g[c]=g[c]<=0?0:Math.min(g[c],m);if(!a&&b.queue){if(l!=g[c])t(b.onAfterFirst);delete g[c]}});t(b.onAfter);function t(a){r.animate(g,j,b.easing,a&&function(){a.call(this,n,b)})}}).end()};k.max=function(a,i){var e=i=='x'?'Width':'Height',h='scroll'+e;if(!d(a).is('html,body'))return a[h]-d(a)[e.toLowerCase()]();var c='client'+e,l=a.ownerDocument.documentElement,m=a.ownerDocument.body;return Math.max(l[h],m[h])-Math.min(l[c],m[c])};function p(a){return typeof a=='object'?a:{top:a,left:a}}})(jQuery);
|
;(function(d){var k=d.scrollTo=function(a,i,e){d(window).scrollTo(a,i,e)};k.defaults={axis:'xy',duration:parseFloat(d.fn.jquery)>=1.3?0:1};k.window=function(a){return d(window)._scrollable()};d.fn._scrollable=function(){return this.map(function(){var a=this,i=!a.nodeName||d.inArray(a.nodeName.toLowerCase(),['iframe','#document','html','body'])!=-1;if(!i)return a;var e=(a.contentWindow||a).document||a.ownerDocument||a;return d.browser.safari||e.compatMode=='BackCompat'?e.body:e.documentElement})};d.fn.scrollTo=function(n,j,b){if(typeof j=='object'){b=j;j=0}if(typeof b=='function')b={onAfter:b};if(n=='max')n=9e9;b=d.extend({},k.defaults,b);j=j||b.speed||b.duration;b.queue=b.queue&&b.axis.length>1;if(b.queue)j/=2;b.offset=p(b.offset);b.over=p(b.over);return this._scrollable().each(function(){var q=this,r=d(q),f=n,s,g={},u=r.is('html,body');switch(typeof f){case'number':case'string':if(/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(f)){f=p(f);break}f=d(f,this);case'object':if(f.is||f.style)s=(f=d(f)).offset()}d.each(b.axis.split(''),function(a,i){var e=i=='x'?'Left':'Top',h=e.toLowerCase(),c='scroll'+e,l=q[c],m=k.max(q,i);if(s){g[c]=s[h]+(u?0:l-r.offset()[h]);if(b.margin){g[c]-=parseInt(f.css('margin'+e))||0;g[c]-=parseInt(f.css('border'+e+'Width'))||0}g[c]+=b.offset[h]||0;if(b.over[h])g[c]+=f[i=='x'?'width':'height']()*b.over[h]}else{var o=f[h];g[c]=o.slice&&o.slice(-1)=='%'?parseFloat(o)/100*m:o}if(/^\d+$/.test(g[c]))g[c]=g[c]<=0?0:Math.min(g[c],m);if(!a&&b.queue){if(l!=g[c])t(b.onAfterFirst);delete g[c]}});t(b.onAfter);function t(a){r.animate(g,j,b.easing,a&&function(){a.call(this,n,b)})}}).end()};k.max=function(a,i){var e=i=='x'?'Width':'Height',h='scroll'+e;if(!d(a).is('html,body'))return a[h]-d(a)[e.toLowerCase()]();var c='client'+e,l=a.ownerDocument.documentElement,m=a.ownerDocument.body;return Math.max(l[h],m[h])-Math.min(l[c],m[c])};function p(a){return typeof a=='object'?a:{top:a,left:a}}})(jQuery);
|
||||||
@@ -1,215 +1,215 @@
|
|||||||
/**
|
/**
|
||||||
* jQuery.ScrollTo
|
* jQuery.ScrollTo
|
||||||
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
|
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
|
||||||
* Dual licensed under MIT and GPL.
|
* Dual licensed under MIT and GPL.
|
||||||
* Date: 5/25/2009
|
* Date: 5/25/2009
|
||||||
*
|
*
|
||||||
* @projectDescription Easy element scrolling using jQuery.
|
* @projectDescription Easy element scrolling using jQuery.
|
||||||
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
|
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
|
||||||
* Works with jQuery +1.2.6. Tested on FF 2/3, IE 6/7/8, Opera 9.5/6, Safari 3, Chrome 1 on WinXP.
|
* Works with jQuery +1.2.6. Tested on FF 2/3, IE 6/7/8, Opera 9.5/6, Safari 3, Chrome 1 on WinXP.
|
||||||
*
|
*
|
||||||
* @author Ariel Flesler
|
* @author Ariel Flesler
|
||||||
* @version 1.4.2
|
* @version 1.4.2
|
||||||
*
|
*
|
||||||
* @id jQuery.scrollTo
|
* @id jQuery.scrollTo
|
||||||
* @id jQuery.fn.scrollTo
|
* @id jQuery.fn.scrollTo
|
||||||
* @param {String, Number, DOMElement, jQuery, Object} target Where to scroll the matched elements.
|
* @param {String, Number, DOMElement, jQuery, Object} target Where to scroll the matched elements.
|
||||||
* The different options for target are:
|
* The different options for target are:
|
||||||
* - A number position (will be applied to all axes).
|
* - A number position (will be applied to all axes).
|
||||||
* - A string position ('44', '100px', '+=90', etc ) will be applied to all axes
|
* - A string position ('44', '100px', '+=90', etc ) will be applied to all axes
|
||||||
* - A jQuery/DOM element ( logically, child of the element to scroll )
|
* - A jQuery/DOM element ( logically, child of the element to scroll )
|
||||||
* - A string selector, that will be relative to the element to scroll ( 'li:eq(2)', etc )
|
* - A string selector, that will be relative to the element to scroll ( 'li:eq(2)', etc )
|
||||||
* - A hash { top:x, left:y }, x and y can be any kind of number/string like above.
|
* - A hash { top:x, left:y }, x and y can be any kind of number/string like above.
|
||||||
* - A percentage of the container's dimension/s, for example: 50% to go to the middle.
|
* - A percentage of the container's dimension/s, for example: 50% to go to the middle.
|
||||||
* - The string 'max' for go-to-end.
|
* - The string 'max' for go-to-end.
|
||||||
* @param {Number} duration The OVERALL length of the animation, this argument can be the settings object instead.
|
* @param {Number} duration The OVERALL length of the animation, this argument can be the settings object instead.
|
||||||
* @param {Object,Function} settings Optional set of settings or the onAfter callback.
|
* @param {Object,Function} settings Optional set of settings or the onAfter callback.
|
||||||
* @option {String} axis Which axis must be scrolled, use 'x', 'y', 'xy' or 'yx'.
|
* @option {String} axis Which axis must be scrolled, use 'x', 'y', 'xy' or 'yx'.
|
||||||
* @option {Number} duration The OVERALL length of the animation.
|
* @option {Number} duration The OVERALL length of the animation.
|
||||||
* @option {String} easing The easing method for the animation.
|
* @option {String} easing The easing method for the animation.
|
||||||
* @option {Boolean} margin If true, the margin of the target element will be deducted from the final position.
|
* @option {Boolean} margin If true, the margin of the target element will be deducted from the final position.
|
||||||
* @option {Object, Number} offset Add/deduct from the end position. One number for both axes or { top:x, left:y }.
|
* @option {Object, Number} offset Add/deduct from the end position. One number for both axes or { top:x, left:y }.
|
||||||
* @option {Object, Number} over Add/deduct the height/width multiplied by 'over', can be { top:x, left:y } when using both axes.
|
* @option {Object, Number} over Add/deduct the height/width multiplied by 'over', can be { top:x, left:y } when using both axes.
|
||||||
* @option {Boolean} queue If true, and both axis are given, the 2nd axis will only be animated after the first one ends.
|
* @option {Boolean} queue If true, and both axis are given, the 2nd axis will only be animated after the first one ends.
|
||||||
* @option {Function} onAfter Function to be called after the scrolling ends.
|
* @option {Function} onAfter Function to be called after the scrolling ends.
|
||||||
* @option {Function} onAfterFirst If queuing is activated, this function will be called after the first scrolling ends.
|
* @option {Function} onAfterFirst If queuing is activated, this function will be called after the first scrolling ends.
|
||||||
* @return {jQuery} Returns the same jQuery object, for chaining.
|
* @return {jQuery} Returns the same jQuery object, for chaining.
|
||||||
*
|
*
|
||||||
* @desc Scroll to a fixed position
|
* @desc Scroll to a fixed position
|
||||||
* @example $('div').scrollTo( 340 );
|
* @example $('div').scrollTo( 340 );
|
||||||
*
|
*
|
||||||
* @desc Scroll relatively to the actual position
|
* @desc Scroll relatively to the actual position
|
||||||
* @example $('div').scrollTo( '+=340px', { axis:'y' } );
|
* @example $('div').scrollTo( '+=340px', { axis:'y' } );
|
||||||
*
|
*
|
||||||
* @dec Scroll using a selector (relative to the scrolled element)
|
* @dec Scroll using a selector (relative to the scrolled element)
|
||||||
* @example $('div').scrollTo( 'p.paragraph:eq(2)', 500, { easing:'swing', queue:true, axis:'xy' } );
|
* @example $('div').scrollTo( 'p.paragraph:eq(2)', 500, { easing:'swing', queue:true, axis:'xy' } );
|
||||||
*
|
*
|
||||||
* @ Scroll to a DOM element (same for jQuery object)
|
* @ Scroll to a DOM element (same for jQuery object)
|
||||||
* @example var second_child = document.getElementById('container').firstChild.nextSibling;
|
* @example var second_child = document.getElementById('container').firstChild.nextSibling;
|
||||||
* $('#container').scrollTo( second_child, { duration:500, axis:'x', onAfter:function(){
|
* $('#container').scrollTo( second_child, { duration:500, axis:'x', onAfter:function(){
|
||||||
* alert('scrolled!!');
|
* alert('scrolled!!');
|
||||||
* }});
|
* }});
|
||||||
*
|
*
|
||||||
* @desc Scroll on both axes, to different values
|
* @desc Scroll on both axes, to different values
|
||||||
* @example $('div').scrollTo( { top: 300, left:'+=200' }, { axis:'xy', offset:-20 } );
|
* @example $('div').scrollTo( { top: 300, left:'+=200' }, { axis:'xy', offset:-20 } );
|
||||||
*/
|
*/
|
||||||
;(function( $ ){
|
;(function( $ ){
|
||||||
|
|
||||||
var $scrollTo = $.scrollTo = function( target, duration, settings ){
|
var $scrollTo = $.scrollTo = function( target, duration, settings ){
|
||||||
$(window).scrollTo( target, duration, settings );
|
$(window).scrollTo( target, duration, settings );
|
||||||
};
|
};
|
||||||
|
|
||||||
$scrollTo.defaults = {
|
$scrollTo.defaults = {
|
||||||
axis:'xy',
|
axis:'xy',
|
||||||
duration: parseFloat($.fn.jquery) >= 1.3 ? 0 : 1
|
duration: parseFloat($.fn.jquery) >= 1.3 ? 0 : 1
|
||||||
};
|
};
|
||||||
|
|
||||||
// Returns the element that needs to be animated to scroll the window.
|
// Returns the element that needs to be animated to scroll the window.
|
||||||
// Kept for backwards compatibility (specially for localScroll & serialScroll)
|
// Kept for backwards compatibility (specially for localScroll & serialScroll)
|
||||||
$scrollTo.window = function( scope ){
|
$scrollTo.window = function( scope ){
|
||||||
return $(window)._scrollable();
|
return $(window)._scrollable();
|
||||||
};
|
};
|
||||||
|
|
||||||
// Hack, hack, hack :)
|
// Hack, hack, hack :)
|
||||||
// Returns the real elements to scroll (supports window/iframes, documents and regular nodes)
|
// Returns the real elements to scroll (supports window/iframes, documents and regular nodes)
|
||||||
$.fn._scrollable = function(){
|
$.fn._scrollable = function(){
|
||||||
return this.map(function(){
|
return this.map(function(){
|
||||||
var elem = this,
|
var elem = this,
|
||||||
isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;
|
isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;
|
||||||
|
|
||||||
if( !isWin )
|
if( !isWin )
|
||||||
return elem;
|
return elem;
|
||||||
|
|
||||||
var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;
|
var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;
|
||||||
|
|
||||||
return $.browser.safari || doc.compatMode == 'BackCompat' ?
|
return $.browser.safari || doc.compatMode == 'BackCompat' ?
|
||||||
doc.body :
|
doc.body :
|
||||||
doc.documentElement;
|
doc.documentElement;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
$.fn.scrollTo = function( target, duration, settings ){
|
$.fn.scrollTo = function( target, duration, settings ){
|
||||||
if( typeof duration == 'object' ){
|
if( typeof duration == 'object' ){
|
||||||
settings = duration;
|
settings = duration;
|
||||||
duration = 0;
|
duration = 0;
|
||||||
}
|
}
|
||||||
if( typeof settings == 'function' )
|
if( typeof settings == 'function' )
|
||||||
settings = { onAfter:settings };
|
settings = { onAfter:settings };
|
||||||
|
|
||||||
if( target == 'max' )
|
if( target == 'max' )
|
||||||
target = 9e9;
|
target = 9e9;
|
||||||
|
|
||||||
settings = $.extend( {}, $scrollTo.defaults, settings );
|
settings = $.extend( {}, $scrollTo.defaults, settings );
|
||||||
// Speed is still recognized for backwards compatibility
|
// Speed is still recognized for backwards compatibility
|
||||||
duration = duration || settings.speed || settings.duration;
|
duration = duration || settings.speed || settings.duration;
|
||||||
// Make sure the settings are given right
|
// Make sure the settings are given right
|
||||||
settings.queue = settings.queue && settings.axis.length > 1;
|
settings.queue = settings.queue && settings.axis.length > 1;
|
||||||
|
|
||||||
if( settings.queue )
|
if( settings.queue )
|
||||||
// Let's keep the overall duration
|
// Let's keep the overall duration
|
||||||
duration /= 2;
|
duration /= 2;
|
||||||
settings.offset = both( settings.offset );
|
settings.offset = both( settings.offset );
|
||||||
settings.over = both( settings.over );
|
settings.over = both( settings.over );
|
||||||
|
|
||||||
return this._scrollable().each(function(){
|
return this._scrollable().each(function(){
|
||||||
var elem = this,
|
var elem = this,
|
||||||
$elem = $(elem),
|
$elem = $(elem),
|
||||||
targ = target, toff, attr = {},
|
targ = target, toff, attr = {},
|
||||||
win = $elem.is('html,body');
|
win = $elem.is('html,body');
|
||||||
|
|
||||||
switch( typeof targ ){
|
switch( typeof targ ){
|
||||||
// A number will pass the regex
|
// A number will pass the regex
|
||||||
case 'number':
|
case 'number':
|
||||||
case 'string':
|
case 'string':
|
||||||
if( /^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(targ) ){
|
if( /^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(targ) ){
|
||||||
targ = both( targ );
|
targ = both( targ );
|
||||||
// We are done
|
// We are done
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
// Relative selector, no break!
|
// Relative selector, no break!
|
||||||
targ = $(targ,this);
|
targ = $(targ,this);
|
||||||
case 'object':
|
case 'object':
|
||||||
// DOMElement / jQuery
|
// DOMElement / jQuery
|
||||||
if( targ.is || targ.style )
|
if( targ.is || targ.style )
|
||||||
// Get the real position of the target
|
// Get the real position of the target
|
||||||
toff = (targ = $(targ)).offset();
|
toff = (targ = $(targ)).offset();
|
||||||
}
|
}
|
||||||
$.each( settings.axis.split(''), function( i, axis ){
|
$.each( settings.axis.split(''), function( i, axis ){
|
||||||
var Pos = axis == 'x' ? 'Left' : 'Top',
|
var Pos = axis == 'x' ? 'Left' : 'Top',
|
||||||
pos = Pos.toLowerCase(),
|
pos = Pos.toLowerCase(),
|
||||||
key = 'scroll' + Pos,
|
key = 'scroll' + Pos,
|
||||||
old = elem[key],
|
old = elem[key],
|
||||||
max = $scrollTo.max(elem, axis);
|
max = $scrollTo.max(elem, axis);
|
||||||
|
|
||||||
if( toff ){// jQuery / DOMElement
|
if( toff ){// jQuery / DOMElement
|
||||||
attr[key] = toff[pos] + ( win ? 0 : old - $elem.offset()[pos] );
|
attr[key] = toff[pos] + ( win ? 0 : old - $elem.offset()[pos] );
|
||||||
|
|
||||||
// If it's a dom element, reduce the margin
|
// If it's a dom element, reduce the margin
|
||||||
if( settings.margin ){
|
if( settings.margin ){
|
||||||
attr[key] -= parseInt(targ.css('margin'+Pos)) || 0;
|
attr[key] -= parseInt(targ.css('margin'+Pos)) || 0;
|
||||||
attr[key] -= parseInt(targ.css('border'+Pos+'Width')) || 0;
|
attr[key] -= parseInt(targ.css('border'+Pos+'Width')) || 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
attr[key] += settings.offset[pos] || 0;
|
attr[key] += settings.offset[pos] || 0;
|
||||||
|
|
||||||
if( settings.over[pos] )
|
if( settings.over[pos] )
|
||||||
// Scroll to a fraction of its width/height
|
// Scroll to a fraction of its width/height
|
||||||
attr[key] += targ[axis=='x'?'width':'height']() * settings.over[pos];
|
attr[key] += targ[axis=='x'?'width':'height']() * settings.over[pos];
|
||||||
}else{
|
}else{
|
||||||
var val = targ[pos];
|
var val = targ[pos];
|
||||||
// Handle percentage values
|
// Handle percentage values
|
||||||
attr[key] = val.slice && val.slice(-1) == '%' ?
|
attr[key] = val.slice && val.slice(-1) == '%' ?
|
||||||
parseFloat(val) / 100 * max
|
parseFloat(val) / 100 * max
|
||||||
: val;
|
: val;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Number or 'number'
|
// Number or 'number'
|
||||||
if( /^\d+$/.test(attr[key]) )
|
if( /^\d+$/.test(attr[key]) )
|
||||||
// Check the limits
|
// Check the limits
|
||||||
attr[key] = attr[key] <= 0 ? 0 : Math.min( attr[key], max );
|
attr[key] = attr[key] <= 0 ? 0 : Math.min( attr[key], max );
|
||||||
|
|
||||||
// Queueing axes
|
// Queueing axes
|
||||||
if( !i && settings.queue ){
|
if( !i && settings.queue ){
|
||||||
// Don't waste time animating, if there's no need.
|
// Don't waste time animating, if there's no need.
|
||||||
if( old != attr[key] )
|
if( old != attr[key] )
|
||||||
// Intermediate animation
|
// Intermediate animation
|
||||||
animate( settings.onAfterFirst );
|
animate( settings.onAfterFirst );
|
||||||
// Don't animate this axis again in the next iteration.
|
// Don't animate this axis again in the next iteration.
|
||||||
delete attr[key];
|
delete attr[key];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
animate( settings.onAfter );
|
animate( settings.onAfter );
|
||||||
|
|
||||||
function animate( callback ){
|
function animate( callback ){
|
||||||
$elem.animate( attr, duration, settings.easing, callback && function(){
|
$elem.animate( attr, duration, settings.easing, callback && function(){
|
||||||
callback.call(this, target, settings);
|
callback.call(this, target, settings);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
}).end();
|
}).end();
|
||||||
};
|
};
|
||||||
|
|
||||||
// Max scrolling position, works on quirks mode
|
// Max scrolling position, works on quirks mode
|
||||||
// It only fails (not too badly) on IE, quirks mode.
|
// It only fails (not too badly) on IE, quirks mode.
|
||||||
$scrollTo.max = function( elem, axis ){
|
$scrollTo.max = function( elem, axis ){
|
||||||
var Dim = axis == 'x' ? 'Width' : 'Height',
|
var Dim = axis == 'x' ? 'Width' : 'Height',
|
||||||
scroll = 'scroll'+Dim;
|
scroll = 'scroll'+Dim;
|
||||||
|
|
||||||
if( !$(elem).is('html,body') )
|
if( !$(elem).is('html,body') )
|
||||||
return elem[scroll] - $(elem)[Dim.toLowerCase()]();
|
return elem[scroll] - $(elem)[Dim.toLowerCase()]();
|
||||||
|
|
||||||
var size = 'client' + Dim,
|
var size = 'client' + Dim,
|
||||||
html = elem.ownerDocument.documentElement,
|
html = elem.ownerDocument.documentElement,
|
||||||
body = elem.ownerDocument.body;
|
body = elem.ownerDocument.body;
|
||||||
|
|
||||||
return Math.max( html[scroll], body[scroll] )
|
return Math.max( html[scroll], body[scroll] )
|
||||||
- Math.min( html[size] , body[size] );
|
- Math.min( html[size] , body[size] );
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function both( val ){
|
function both( val ){
|
||||||
return typeof val == 'object' ? val : { top:val, left:val };
|
return typeof val == 'object' ? val : { top:val, left:val };
|
||||||
};
|
};
|
||||||
|
|
||||||
})( jQuery );
|
})( jQuery );
|
||||||
@@ -1,12 +1,12 @@
|
|||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
/* This code is executed after the DOM has been completely loaded */
|
/* This code is executed after the DOM has been completely loaded */
|
||||||
|
|
||||||
$('nav a,footer a.up').click(function(e){
|
$('nav a,footer a.up').click(function(e){
|
||||||
|
|
||||||
// If a link has been clicked, scroll the page to the link's hash target:
|
// If a link has been clicked, scroll the page to the link's hash target:
|
||||||
|
|
||||||
$.scrollTo( this.hash || 0, 1500);
|
$.scrollTo( this.hash || 0, 1500);
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
@@ -1,219 +1,219 @@
|
|||||||
*{
|
*{
|
||||||
/* Universal reset: */
|
/* Universal reset: */
|
||||||
margin:0;
|
margin:0;
|
||||||
padding:0;
|
padding:0;
|
||||||
}
|
}
|
||||||
|
|
||||||
header,footer,
|
header,footer,
|
||||||
article,section,
|
article,section,
|
||||||
hgroup,nav,
|
hgroup,nav,
|
||||||
figure{
|
figure{
|
||||||
/* Giving a display value to the HTML5 rendered elements: */
|
/* Giving a display value to the HTML5 rendered elements: */
|
||||||
display:block;
|
display:block;
|
||||||
}
|
}
|
||||||
|
|
||||||
body{
|
body{
|
||||||
/* Setting the default text color, size, page background and a font stack: */
|
/* Setting the default text color, size, page background and a font stack: */
|
||||||
font-size:0.825em;
|
font-size:0.825em;
|
||||||
color:#fcfcfc;
|
color:#fcfcfc;
|
||||||
background-color:#355664;
|
background-color:#355664;
|
||||||
font-family:Arial, Helvetica, sans-serif;
|
font-family:Arial, Helvetica, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Hyperlink Styles: */
|
/* Hyperlink Styles: */
|
||||||
|
|
||||||
a, a:visited {
|
a, a:visited {
|
||||||
color:#0196e3;
|
color:#0196e3;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
outline:none;
|
outline:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover{
|
a:hover{
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a img{
|
a img{
|
||||||
border:none;
|
border:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Headings: */
|
/* Headings: */
|
||||||
|
|
||||||
h1,h2,h3{
|
h1,h2,h3{
|
||||||
font-family:"Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
|
font-family:"Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
|
||||||
text-shadow:0 1px 1px black;
|
text-shadow:0 1px 1px black;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1{
|
h1{
|
||||||
/* The logo text */
|
/* The logo text */
|
||||||
font-size:3.5em;
|
font-size:3.5em;
|
||||||
padding:0.5em 0 0;
|
padding:0.5em 0 0;
|
||||||
text-transform:uppercase;
|
text-transform:uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3{
|
h3{
|
||||||
/* The slogan text */
|
/* The slogan text */
|
||||||
font-family:forte,"Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
|
font-family:forte,"Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
|
||||||
font-size:2em;
|
font-size:2em;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
margin:0 0 1em;
|
margin:0 0 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
h2{
|
h2{
|
||||||
font-size:2.2em;
|
font-size:2.2em;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
letter-spacing:0.01em;
|
letter-spacing:0.01em;
|
||||||
text-transform:uppercase;
|
text-transform:uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
p{
|
p{
|
||||||
line-height:1.5em;
|
line-height:1.5em;
|
||||||
padding-bottom:1em;
|
padding-bottom:1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.line{
|
.line{
|
||||||
/* The dividing line: */
|
/* The dividing line: */
|
||||||
height:1px;
|
height:1px;
|
||||||
background-color:#24404c;
|
background-color:#24404c;
|
||||||
border-bottom:1px solid #416371;
|
border-bottom:1px solid #416371;
|
||||||
margin:1em 0;
|
margin:1em 0;
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
article .line{
|
article .line{
|
||||||
/* The dividing line inside of the article is darker: */
|
/* The dividing line inside of the article is darker: */
|
||||||
background-color:#15242a;
|
background-color:#15242a;
|
||||||
border-bottom-color:#204656;
|
border-bottom-color:#204656;
|
||||||
margin:1.3em 0;
|
margin:1.3em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer .line{
|
footer .line{
|
||||||
margin:2em 0;
|
margin:2em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav{
|
nav{
|
||||||
background:url(img/gradient_light.jpg) repeat-x 50% 50% #f8f8f8;
|
background:url(img/gradient_light.jpg) repeat-x 50% 50% #f8f8f8;
|
||||||
padding:0 5px;
|
padding:0 5px;
|
||||||
position:absolute;
|
position:absolute;
|
||||||
right:0;
|
right:0;
|
||||||
top:4em;
|
top:4em;
|
||||||
|
|
||||||
border:1px solid #FCFCFC;
|
border:1px solid #FCFCFC;
|
||||||
|
|
||||||
-moz-box-shadow:0 1px 1px #333333;
|
-moz-box-shadow:0 1px 1px #333333;
|
||||||
-webkit-box-shadow:0 1px 1px #333333;
|
-webkit-box-shadow:0 1px 1px #333333;
|
||||||
box-shadow:0 1px 1px #333333;
|
box-shadow:0 1px 1px #333333;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The clearfix hack to clear the floats: */
|
/* The clearfix hack to clear the floats: */
|
||||||
|
|
||||||
.clear:after{
|
.clear:after{
|
||||||
content: ".";
|
content: ".";
|
||||||
display: block;
|
display: block;
|
||||||
height: 0;
|
height: 0;
|
||||||
clear: both;
|
clear: both;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The navigation styling: */
|
/* The navigation styling: */
|
||||||
|
|
||||||
nav ul li{
|
nav ul li{
|
||||||
display:inline;
|
display:inline;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li a,
|
nav ul li a,
|
||||||
nav ul li a:visited{
|
nav ul li a:visited{
|
||||||
color:#565656;
|
color:#565656;
|
||||||
display:block;
|
display:block;
|
||||||
float:left;
|
float:left;
|
||||||
font-size:1.25em;
|
font-size:1.25em;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
margin:5px 2px;
|
margin:5px 2px;
|
||||||
padding:7px 10px 4px;
|
padding:7px 10px 4px;
|
||||||
text-shadow:0 1px 1px white;
|
text-shadow:0 1px 1px white;
|
||||||
text-transform:uppercase;
|
text-transform:uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li a:hover{
|
nav ul li a:hover{
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
background-color:#f0f0f0;
|
background-color:#f0f0f0;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav, article, nav ul li a,figure{
|
nav, article, nav ul li a,figure{
|
||||||
/* Applying CSS3 rounded corners: */
|
/* Applying CSS3 rounded corners: */
|
||||||
-moz-border-radius:10px;
|
-moz-border-radius:10px;
|
||||||
-webkit-border-radius:10px;
|
-webkit-border-radius:10px;
|
||||||
border-radius:10px;
|
border-radius:10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Article styles: */
|
/* Article styles: */
|
||||||
|
|
||||||
#page{
|
#page{
|
||||||
width:960px;
|
width:960px;
|
||||||
margin:0 auto;
|
margin:0 auto;
|
||||||
position:relative;
|
position:relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
article{
|
article{
|
||||||
background-color:#213E4A;
|
background-color:#213E4A;
|
||||||
margin:3em 0;
|
margin:3em 0;
|
||||||
padding:20px;
|
padding:20px;
|
||||||
|
|
||||||
text-shadow:0 2px 0 black;
|
text-shadow:0 2px 0 black;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure{
|
figure{
|
||||||
border:3px solid #142830;
|
border:3px solid #142830;
|
||||||
float:right;
|
float:right;
|
||||||
height:300px;
|
height:300px;
|
||||||
margin-left:15px;
|
margin-left:15px;
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
width:500px;
|
width:500px;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure:hover{
|
figure:hover{
|
||||||
-moz-box-shadow:0 0 2px #4D7788;
|
-moz-box-shadow:0 0 2px #4D7788;
|
||||||
-webkit-box-shadow:0 0 2px #4D7788;
|
-webkit-box-shadow:0 0 2px #4D7788;
|
||||||
box-shadow:0 0 2px #4D7788;
|
box-shadow:0 0 2px #4D7788;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure img{
|
figure img{
|
||||||
margin-left:-60px;
|
margin-left:-60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Footer styling: */
|
/* Footer styling: */
|
||||||
|
|
||||||
footer{
|
footer{
|
||||||
margin-bottom:30px;
|
margin-bottom:30px;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
font-size:0.825em;
|
font-size:0.825em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
footer p{
|
footer p{
|
||||||
margin-bottom:-2.5em;
|
margin-bottom:-2.5em;
|
||||||
position:relative;
|
position:relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer a,footer a:visited{
|
footer a,footer a:visited{
|
||||||
color:#cccccc;
|
color:#cccccc;
|
||||||
background-color:#213e4a;
|
background-color:#213e4a;
|
||||||
display:block;
|
display:block;
|
||||||
padding:2px 4px;
|
padding:2px 4px;
|
||||||
z-index:100;
|
z-index:100;
|
||||||
position:relative;
|
position:relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer a:hover{
|
footer a:hover{
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
background-color:#142830;
|
background-color:#142830;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer a.by{
|
footer a.by{
|
||||||
float:left;
|
float:left;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
footer a.up{
|
footer a.up{
|
||||||
float:right;
|
float:right;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,139 +1,139 @@
|
|||||||
<!DOCTYPE html> <!-- The new doctype -->
|
<!DOCTYPE html> <!-- The new doctype -->
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||||
|
|
||||||
<title>Coding A CSS3 & HTML5 One Page Template | Tutorialzine demo</title>
|
<title>Coding A CSS3 & HTML5 One Page Template | Tutorialzine demo</title>
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="styles.css" />
|
<link rel="stylesheet" type="text/css" href="styles.css" />
|
||||||
|
|
||||||
<!-- Internet Explorer HTML5 enabling code: -->
|
<!-- Internet Explorer HTML5 enabling code: -->
|
||||||
|
|
||||||
<!--[if IE]>
|
<!--[if IE]>
|
||||||
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||||
|
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
.clear {
|
.clear {
|
||||||
zoom: 1;
|
zoom: 1;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
||||||
<![endif]-->
|
<![endif]-->
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<section id="page"> <!-- Defining the #page section with the section tag -->
|
<section id="page"> <!-- Defining the #page section with the section tag -->
|
||||||
|
|
||||||
<header> <!-- Defining the header section of the page with the appropriate tag -->
|
<header> <!-- Defining the header section of the page with the appropriate tag -->
|
||||||
|
|
||||||
<hgroup>
|
<hgroup>
|
||||||
<h1>Your Logo</h1>
|
<h1>Your Logo</h1>
|
||||||
<h3>and a fancy slogan</h3>
|
<h3>and a fancy slogan</h3>
|
||||||
</hgroup>
|
</hgroup>
|
||||||
|
|
||||||
<nav class="clear"> <!-- The nav link semantically marks your main site navigation -->
|
<nav class="clear"> <!-- The nav link semantically marks your main site navigation -->
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="#article1">Photoshoot</a></li>
|
<li><a href="#article1">Photoshoot</a></li>
|
||||||
<li><a href="#article2">Sweet Tabs</a></li>
|
<li><a href="#article2">Sweet Tabs</a></li>
|
||||||
<li><a href="#article3">Navigation Menu</a></li>
|
<li><a href="#article3">Navigation Menu</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<section id="articles"> <!-- A new section with the articles -->
|
<section id="articles"> <!-- A new section with the articles -->
|
||||||
|
|
||||||
<!-- Article 1 start -->
|
<!-- Article 1 start -->
|
||||||
|
|
||||||
<div class="line"></div> <!-- Dividing line -->
|
<div class="line"></div> <!-- Dividing line -->
|
||||||
|
|
||||||
<article id="article1"> <!-- The new article tag. The id is supplied so it can be scrolled into view. -->
|
<article id="article1"> <!-- The new article tag. The id is supplied so it can be scrolled into view. -->
|
||||||
<h2>Photoshoot Effect</h2>
|
<h2>Photoshoot Effect</h2>
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<div class="articleBody clear">
|
<div class="articleBody clear">
|
||||||
|
|
||||||
<figure> <!-- The figure tag marks data (usually an image) that is part of the article -->
|
<figure> <!-- The figure tag marks data (usually an image) that is part of the article -->
|
||||||
<a href="http://tutorialzine.com/2010/02/photo-shoot-css-jquery/"><img src="http://tutorialzine.com/img/featured/641.jpg" width="620" height="340" /></a>
|
<a href="http://tutorialzine.com/2010/02/photo-shoot-css-jquery/"><img src="http://tutorialzine.com/img/featured/641.jpg" width="620" height="340" /></a>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p>In this tutorial, we are creating a photo shoot effect with our just-released PhotoShoot jQuery plug-in. With it you can convert a regular div on the page into a photo shooting stage simulating a camera-like feel.</p>
|
<p>In this tutorial, we are creating a photo shoot effect with our just-released PhotoShoot jQuery plug-in. With it you can convert a regular div on the page into a photo shooting stage simulating a camera-like feel.</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- Article 1 end -->
|
<!-- Article 1 end -->
|
||||||
|
|
||||||
|
|
||||||
<!-- Article 2 start -->
|
<!-- Article 2 start -->
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<article id="article2">
|
<article id="article2">
|
||||||
<h2>Sweet AJAX Tabs</h2>
|
<h2>Sweet AJAX Tabs</h2>
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<div class="articleBody clear">
|
<div class="articleBody clear">
|
||||||
<figure>
|
<figure>
|
||||||
<a href="http://tutorialzine.com/2010/01/sweet-tabs-jquery-ajax-css/"><img src="http://tutorialzine.com/img/featured/633.jpg" width="620" height="340" /></a>
|
<a href="http://tutorialzine.com/2010/01/sweet-tabs-jquery-ajax-css/"><img src="http://tutorialzine.com/img/featured/633.jpg" width="620" height="340" /></a>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p>Here we are making sweet AJAX-powered tabs with CSS3 and the newly released version 1.4 of jQuery.</p>
|
<p>Here we are making sweet AJAX-powered tabs with CSS3 and the newly released version 1.4 of jQuery.</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- Article 2 end -->
|
<!-- Article 2 end -->
|
||||||
|
|
||||||
<!-- Article 3 start -->
|
<!-- Article 3 start -->
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<article id="article3">
|
<article id="article3">
|
||||||
<h2>Halftone Navigation Menu</h2>
|
<h2>Halftone Navigation Menu</h2>
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<div class="articleBody clear">
|
<div class="articleBody clear">
|
||||||
<figure>
|
<figure>
|
||||||
<a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/"><img src="http://tutorialzine.com/img/featured/610.jpg" width="620" height="340" /></a>
|
<a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/"><img src="http://tutorialzine.com/img/featured/610.jpg" width="620" height="340" /></a>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p>Today we are making a CSS3 & jQuery halftone-style navigation menu, which will allow you to display animated halftone-style shapes in accordance with the navigation links, and will provide a simple editor for creating additional shapes as well.</p>
|
<p>Today we are making a CSS3 & jQuery halftone-style navigation menu, which will allow you to display animated halftone-style shapes in accordance with the navigation links, and will provide a simple editor for creating additional shapes as well.</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus quam quis nibh fringilla sit amet consectetur lectus malesuada. Sed nec libero erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mi nisi, rhoncus ut vestibulum ac, sollicitudin quis lorem. Duis felis dui, vulputate nec adipiscing nec, interdum vel tortor. Sed gravida, erat nec rutrum tincidunt, metus mauris imperdiet nunc, et elementum tortor nunc at eros. Donec malesuada congue molestie. Suspendisse potenti. Vestibulum cursus congue sem et feugiat. Morbi quis elit odio. </p>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- Article 3 end -->
|
<!-- Article 3 end -->
|
||||||
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<footer> <!-- Marking the footer section -->
|
<footer> <!-- Marking the footer section -->
|
||||||
|
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
|
||||||
<p>Copyright 2010 - YourSite.com</p> <!-- Change the copyright notice -->
|
<p>Copyright 2010 - YourSite.com</p> <!-- Change the copyright notice -->
|
||||||
|
|
||||||
<a href="#" class="up">Go UP</a>
|
<a href="#" class="up">Go UP</a>
|
||||||
<a href="http://tutorialzine.com/2010/02/html5-css3-website-template/" class="by">Template by Tutorialzine</a>
|
<a href="http://tutorialzine.com/2010/02/html5-css3-website-template/" class="by">Template by Tutorialzine</a>
|
||||||
|
|
||||||
|
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
</section> <!-- Closing the #page section -->
|
</section> <!-- Closing the #page section -->
|
||||||
|
|
||||||
<!-- JavaScript Includes -->
|
<!-- JavaScript Includes -->
|
||||||
|
|
||||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
|
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
|
||||||
<script src="jquery.scrollTo-1.4.2/jquery.scrollTo-min.js"></script>
|
<script src="jquery.scrollTo-1.4.2/jquery.scrollTo-min.js"></script>
|
||||||
<script src="script.js"></script>
|
<script src="script.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,43 +1,43 @@
|
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||||
<title>Halftone Navigation Menu With jQuery & CSS3 | Tutorialzine demo</title>
|
<title>Halftone Navigation Menu With jQuery & CSS3 | Tutorialzine demo</title>
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="styles.css" />
|
<link rel="stylesheet" type="text/css" href="styles.css" />
|
||||||
|
|
||||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
|
||||||
|
|
||||||
<script type="text/javascript" src="script.js"></script>
|
<script type="text/javascript" src="script.js"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<h1>Halftone Navigation Menu With jQuery & CSS3</h1>
|
<h1>Halftone Navigation Menu With jQuery & CSS3</h1>
|
||||||
<h2>View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial »</a></h2>
|
<h2>View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial »</a></h2>
|
||||||
|
|
||||||
|
|
||||||
<div id="main">
|
<div id="main">
|
||||||
|
|
||||||
<div id="navigation">
|
<div id="navigation">
|
||||||
<ul class="menuUL">
|
<ul class="menuUL">
|
||||||
<!-- The class names that are assigned to the links correspond to name of the shape that is shown on hover: -->
|
<!-- The class names that are assigned to the links correspond to name of the shape that is shown on hover: -->
|
||||||
<li><a href="#" class="house">Home</a></li>
|
<li><a href="#" class="house">Home</a></li>
|
||||||
<li><a href="#" class="wrench">Services</a></li>
|
<li><a href="#" class="wrench">Services</a></li>
|
||||||
<li><a href="#" class="envelope">Contact</a></li>
|
<li><a href="#" class="envelope">Contact</a></li>
|
||||||
<li><a href="#" class="info">About</a></li>
|
<li><a href="#" class="info">About</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="clear"></div>
|
<div class="clear"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="stage">
|
<div id="stage">
|
||||||
<!-- The dot divs are shown here -->
|
<!-- The dot divs are shown here -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="tutInfo">This is a tutorialzine demo. View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial</a>, or download the <a href="demo.zip">source files</a>.</p>
|
<p class="tutInfo">This is a tutorialzine demo. View the <a href="http://tutorialzine.com/2010/01/halftone-navigation-menu-jquery-css/">original tutorial</a>, or download the <a href="demo.zip">source files</a>.</p>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,121 +1,121 @@
|
|||||||
/* Set serviceMode to true to create your own shapes: */
|
/* Set serviceMode to true to create your own shapes: */
|
||||||
var serviceMode = false;
|
var serviceMode = false;
|
||||||
|
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
/* This code is executed after the DOM has been completely loaded */
|
/* This code is executed after the DOM has been completely loaded */
|
||||||
|
|
||||||
var str=[];
|
var str=[];
|
||||||
var perRow = 16;
|
var perRow = 16;
|
||||||
|
|
||||||
/* Generating the dot divs: */
|
/* Generating the dot divs: */
|
||||||
|
|
||||||
for(var i=0;i<192;i++)
|
for(var i=0;i<192;i++)
|
||||||
{
|
{
|
||||||
str.push('<div class="dot" id="d-'+i+'" />');
|
str.push('<div class="dot" id="d-'+i+'" />');
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Joining the array into a string and adding it to the inner html of the stage div: */
|
/* Joining the array into a string and adding it to the inner html of the stage div: */
|
||||||
|
|
||||||
$('#stage').html(str.join(''));
|
$('#stage').html(str.join(''));
|
||||||
|
|
||||||
/* Using the hover method: */
|
/* Using the hover method: */
|
||||||
|
|
||||||
$('#navigation li a').hover(function(e){
|
$('#navigation li a').hover(function(e){
|
||||||
|
|
||||||
/* serviceDraw is a cut-out version of the draw function, used for shape editing and composing: */
|
/* serviceDraw is a cut-out version of the draw function, used for shape editing and composing: */
|
||||||
|
|
||||||
if(serviceMode)
|
if(serviceMode)
|
||||||
serviceDraw($(this).attr('class'));
|
serviceDraw($(this).attr('class'));
|
||||||
else
|
else
|
||||||
draw($(this).attr('class'));
|
draw($(this).attr('class'));
|
||||||
}, function(e){
|
}, function(e){
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
/* Caching the dot divs into a variable for performance: */
|
/* Caching the dot divs into a variable for performance: */
|
||||||
dots = $('.dot');
|
dots = $('.dot');
|
||||||
|
|
||||||
if(serviceMode)
|
if(serviceMode)
|
||||||
{
|
{
|
||||||
/* If we are in service mode, show borders around the dot divs, add the export link, and listen for clicks: */
|
/* If we are in service mode, show borders around the dot divs, add the export link, and listen for clicks: */
|
||||||
|
|
||||||
dots.css({
|
dots.css({
|
||||||
border:'1px solid black',
|
border:'1px solid black',
|
||||||
width:dots.eq(0).width()-2,
|
width:dots.eq(0).width()-2,
|
||||||
height:dots.eq(0).height()-2,
|
height:dots.eq(0).height()-2,
|
||||||
cursor:'pointer'
|
cursor:'pointer'
|
||||||
})
|
})
|
||||||
|
|
||||||
$('<div/>').css({
|
$('<div/>').css({
|
||||||
position:'absolute',
|
position:'absolute',
|
||||||
bottom:-20,
|
bottom:-20,
|
||||||
right:0
|
right:0
|
||||||
}).html('<a href="" onclick="outputString();return false;">[Export Shape]</a>').appendTo('#stage');
|
}).html('<a href="" onclick="outputString();return false;">[Export Shape]</a>').appendTo('#stage');
|
||||||
|
|
||||||
dots.click(function(){
|
dots.click(function(){
|
||||||
$(this).toggleClass('active');
|
$(this).toggleClass('active');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
var shapes={
|
var shapes={
|
||||||
|
|
||||||
/* Each shape is described by an array of points. You can add your own shapes here,
|
/* Each shape is described by an array of points. You can add your own shapes here,
|
||||||
just don't forget to add a coma after each array, except for the last one */
|
just don't forget to add a coma after each array, except for the last one */
|
||||||
|
|
||||||
house:[22,37,38,39,52,53,54,55,56,67,68,69,70,71,72,73,82,83,84,85,86,87,88,89,90,99,100,104,105,115,116,120,121,131,132,136,137,147,148,150,151,152,153,163,164,166,167,168,169],
|
house:[22,37,38,39,52,53,54,55,56,67,68,69,70,71,72,73,82,83,84,85,86,87,88,89,90,99,100,104,105,115,116,120,121,131,132,136,137,147,148,150,151,152,153,163,164,166,167,168,169],
|
||||||
wrench:[22,23,24,25,26,27,38,39,40,41,42,43,54,55,58,59,70,71,86,87,88,89,101,102,103,104,105,116,117,118,131,132,133,146,147,148,163],
|
wrench:[22,23,24,25,26,27,38,39,40,41,42,43,54,55,58,59,70,71,86,87,88,89,101,102,103,104,105,116,117,118,131,132,133,146,147,148,163],
|
||||||
envelope:[34,35,36,37,38,39,40,41,42,43,44,50,51,52,58,59,60,66,68,69,73,74,76,82,85,86,88,89,92,98,102,103,104,108,114,119,124,130,140,146,147,148,149,150,151,152,153,154,155,156],
|
envelope:[34,35,36,37,38,39,40,41,42,43,44,50,51,52,58,59,60,66,68,69,73,74,76,82,85,86,88,89,92,98,102,103,104,108,114,119,124,130,140,146,147,148,149,150,151,152,153,154,155,156],
|
||||||
info:[22,23,38,39,69,70,71,86,87,102,103,118,119,134,135,150,151,166,167,168]
|
info:[22,23,38,39,69,70,71,86,87,102,103,118,119,134,135,150,151,166,167,168]
|
||||||
}
|
}
|
||||||
|
|
||||||
var stopCounter = 0;
|
var stopCounter = 0;
|
||||||
var dots;
|
var dots;
|
||||||
|
|
||||||
function draw(shape)
|
function draw(shape)
|
||||||
{
|
{
|
||||||
/* This function draws a shape from the shapes object */
|
/* This function draws a shape from the shapes object */
|
||||||
|
|
||||||
stopCounter++;
|
stopCounter++;
|
||||||
var currentCounter = stopCounter;
|
var currentCounter = stopCounter;
|
||||||
|
|
||||||
dots.removeClass('active').css('opacity',0);
|
dots.removeClass('active').css('opacity',0);
|
||||||
|
|
||||||
$.each(shapes[shape],function(i,j){
|
$.each(shapes[shape],function(i,j){
|
||||||
setTimeout(function(){
|
setTimeout(function(){
|
||||||
|
|
||||||
/* If a different shape animaton has been started during the showing of the current one, exit the function */
|
/* If a different shape animaton has been started during the showing of the current one, exit the function */
|
||||||
if(currentCounter!=stopCounter) return false;
|
if(currentCounter!=stopCounter) return false;
|
||||||
|
|
||||||
dots.eq(j).addClass('active').fadeTo('slow',0.4);
|
dots.eq(j).addClass('active').fadeTo('slow',0.4);
|
||||||
|
|
||||||
/* The fade animation is scheduled for 10*i millisecond in the future: */
|
/* The fade animation is scheduled for 10*i millisecond in the future: */
|
||||||
},10*i);
|
},10*i);
|
||||||
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function serviceDraw(shape)
|
function serviceDraw(shape)
|
||||||
{
|
{
|
||||||
/* A cut out version of the draw function, used in service mode */
|
/* A cut out version of the draw function, used in service mode */
|
||||||
|
|
||||||
dots.removeClass('active');
|
dots.removeClass('active');
|
||||||
|
|
||||||
$.each(shapes[shape],function(i,j){
|
$.each(shapes[shape],function(i,j){
|
||||||
dots.eq(j).addClass('active');
|
dots.eq(j).addClass('active');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function outputString()
|
function outputString()
|
||||||
{
|
{
|
||||||
/* Outputs the positions of the active dot divs as a comma-separated string: */
|
/* Outputs the positions of the active dot divs as a comma-separated string: */
|
||||||
|
|
||||||
var str=[];
|
var str=[];
|
||||||
$('.dot.active').each(function(){
|
$('.dot.active').each(function(){
|
||||||
|
|
||||||
str.push(this.id.replace('d-',''));
|
str.push(this.id.replace('d-',''));
|
||||||
})
|
})
|
||||||
|
|
||||||
prompt('Insert this string as an array in the shapes object',str.join(','));
|
prompt('Insert this string as an array in the shapes object',str.join(','));
|
||||||
}
|
}
|
||||||
@@ -1,148 +1,148 @@
|
|||||||
body,h1,h2,h3,p,quote,small,form,input,ul,li,ol,label{
|
body,h1,h2,h3,p,quote,small,form,input,ul,li,ol,label{
|
||||||
/* Simple page reset */
|
/* Simple page reset */
|
||||||
margin:0;
|
margin:0;
|
||||||
padding:0;
|
padding:0;
|
||||||
}
|
}
|
||||||
|
|
||||||
body{
|
body{
|
||||||
/* Setting default text color, background and a font stack */
|
/* Setting default text color, background and a font stack */
|
||||||
color:#cccccc;
|
color:#cccccc;
|
||||||
font-size:0.825em;
|
font-size:0.825em;
|
||||||
background: url(img/background.jpg) no-repeat center top #252525;
|
background: url(img/background.jpg) no-repeat center top #252525;
|
||||||
font-family:Arial, Helvetica, sans-serif;
|
font-family:Arial, Helvetica, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menuUL li{
|
.menuUL li{
|
||||||
/* This will arrange the LI-s next to each other */
|
/* This will arrange the LI-s next to each other */
|
||||||
display:inline;
|
display:inline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menuUL li a,.menuUL li a:visited{
|
.menuUL li a,.menuUL li a:visited{
|
||||||
/* Styling the hyperlinks of the menu as buttons */
|
/* Styling the hyperlinks of the menu as buttons */
|
||||||
|
|
||||||
float:left;
|
float:left;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
background:url(img/button_bg.jpg) repeat-x center bottom #666666;
|
background:url(img/button_bg.jpg) repeat-x center bottom #666666;
|
||||||
|
|
||||||
/* display:block allows for additinal CSS rules to take effect, such as paddings: */
|
/* display:block allows for additinal CSS rules to take effect, such as paddings: */
|
||||||
display:block;
|
display:block;
|
||||||
border:1px solid #4D4D4D;
|
border:1px solid #4D4D4D;
|
||||||
color:#CCCCCC;
|
color:#CCCCCC;
|
||||||
border-top-color:#565656;
|
border-top-color:#565656;
|
||||||
|
|
||||||
padding:4px 6px;
|
padding:4px 6px;
|
||||||
margin:4px 5px;
|
margin:4px 5px;
|
||||||
height:16px;
|
height:16px;
|
||||||
|
|
||||||
|
|
||||||
/* Setting a CSS3 box shadow around the button */
|
/* Setting a CSS3 box shadow around the button */
|
||||||
|
|
||||||
-moz-box-shadow:0 0 1px black;
|
-moz-box-shadow:0 0 1px black;
|
||||||
-webkit-box-shadow:0 0 1px black;
|
-webkit-box-shadow:0 0 1px black;
|
||||||
box-shadow:0 0 1px black;
|
box-shadow:0 0 1px black;
|
||||||
|
|
||||||
/* CSS3 text shadow */
|
/* CSS3 text shadow */
|
||||||
text-shadow:0 1px black;
|
text-shadow:0 1px black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menuUL li a:hover{
|
.menuUL li a:hover{
|
||||||
/* On hover show the top, lighter, part of the background: */
|
/* On hover show the top, lighter, part of the background: */
|
||||||
background-position:center top;
|
background-position:center top;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation{
|
#navigation{
|
||||||
/* The navigation menu bar: */
|
/* The navigation menu bar: */
|
||||||
background:#222222;
|
background:#222222;
|
||||||
border:1px solid #111111;
|
border:1px solid #111111;
|
||||||
float:left;
|
float:left;
|
||||||
padding:5px 10px;
|
padding:5px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation,.menuUL li a{
|
#navigation,.menuUL li a{
|
||||||
/* CSS3 rounded corners for both the navigation bar and the buttons: */
|
/* CSS3 rounded corners for both the navigation bar and the buttons: */
|
||||||
-moz-border-radius:4px;
|
-moz-border-radius:4px;
|
||||||
-webkit-border-radius:4px;
|
-webkit-border-radius:4px;
|
||||||
-khtml-border-radius:4px;
|
-khtml-border-radius:4px;
|
||||||
border-radius:4px;
|
border-radius:4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#stage{
|
#stage{
|
||||||
/* The stage contains the individual divs that comprise the halftone icon: */
|
/* The stage contains the individual divs that comprise the halftone icon: */
|
||||||
height:300px;
|
height:300px;
|
||||||
position:absolute;
|
position:absolute;
|
||||||
right:50px;
|
right:50px;
|
||||||
top:20px;
|
top:20px;
|
||||||
width:400px;
|
width:400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dot{
|
.dot{
|
||||||
/* The stage contains 192 .dot divs: */
|
/* The stage contains 192 .dot divs: */
|
||||||
float:left;
|
float:left;
|
||||||
height:25px;
|
height:25px;
|
||||||
width:25px;
|
width:25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dot.active{
|
.dot.active{
|
||||||
/* When assigned the active class, the div shows a background image of a dot: */
|
/* When assigned the active class, the div shows a background image of a dot: */
|
||||||
background:url(img/dot.png) no-repeat center center;
|
background:url(img/dot.png) no-repeat center center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.clear{
|
.clear{
|
||||||
/* Old-school clear fix hack to clear the floats: */
|
/* Old-school clear fix hack to clear the floats: */
|
||||||
clear:both;
|
clear:both;
|
||||||
}
|
}
|
||||||
|
|
||||||
#main{
|
#main{
|
||||||
margin:0 auto;
|
margin:0 auto;
|
||||||
position:relative;
|
position:relative;
|
||||||
width:900px;
|
width:900px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The styles below are only necessary for the demo page */
|
/* The styles below are only necessary for the demo page */
|
||||||
|
|
||||||
h1{
|
h1{
|
||||||
background:#222222;
|
background:#222222;
|
||||||
border-bottom:1px solid black;
|
border-bottom:1px solid black;
|
||||||
font-size:1.5em;
|
font-size:1.5em;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
margin-bottom:15px;
|
margin-bottom:15px;
|
||||||
padding:15px;
|
padding:15px;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size:0.9em;
|
font-size:0.9em;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
padding-right:40px;
|
padding-right:40px;
|
||||||
position:relative;
|
position:relative;
|
||||||
right:0;
|
right:0;
|
||||||
text-align:right;
|
text-align:right;
|
||||||
text-transform:uppercase;
|
text-transform:uppercase;
|
||||||
top:-48px;
|
top:-48px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a, a:visited {
|
a, a:visited {
|
||||||
color:#0196e3;
|
color:#0196e3;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
outline:none;
|
outline:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover{
|
a:hover{
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
p.tutInfo{
|
p.tutInfo{
|
||||||
/* The tutorial info on the bottom of the page */
|
/* The tutorial info on the bottom of the page */
|
||||||
padding:10px 0;
|
padding:10px 0;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
position:absolute;
|
position:absolute;
|
||||||
bottom:0px;
|
bottom:0px;
|
||||||
background:#222222;
|
background:#222222;
|
||||||
border-top:1px solid black;
|
border-top:1px solid black;
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1,h2,p.tutInfo{
|
h1,h2,p.tutInfo{
|
||||||
font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
|
font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,153 +1,153 @@
|
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||||
<head>
|
<head>
|
||||||
<title>Business Co.</title>
|
<title>Business Co.</title>
|
||||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||||
|
|
||||||
<link href="css/styles.css" rel="stylesheet" type="text/css" />
|
<link href="css/styles.css" rel="stylesheet" type="text/css" />
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
<!--
|
<!--
|
||||||
function MM_preloadImages() { //v3.0
|
function MM_preloadImages() { //v3.0
|
||||||
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
|
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
|
||||||
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
|
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
|
||||||
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
|
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_swapImgRestore() { //v3.0
|
function MM_swapImgRestore() { //v3.0
|
||||||
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
|
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_findObj(n, d) { //v4.01
|
function MM_findObj(n, d) { //v4.01
|
||||||
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
|
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
|
||||||
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
|
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
|
||||||
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
|
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
|
||||||
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
|
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
|
||||||
if(!x && d.getElementById) x=d.getElementById(n); return x;
|
if(!x && d.getElementById) x=d.getElementById(n); return x;
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_swapImage() { //v3.0
|
function MM_swapImage() { //v3.0
|
||||||
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
|
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
|
||||||
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
|
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
|
||||||
}
|
}
|
||||||
//-->
|
//-->
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body onload="MM_preloadImages('images/btn_1_over.jpg','images/btn_2_over.jpg','images/btn_3_over.jpg','images/btn_4_over.jpg','images/btn_5_over.jpg', 'images/btn_6_over.jpg');">
|
<body onload="MM_preloadImages('images/btn_1_over.jpg','images/btn_2_over.jpg','images/btn_3_over.jpg','images/btn_4_over.jpg','images/btn_5_over.jpg', 'images/btn_6_over.jpg');">
|
||||||
<!-- Save for Web Slices (index.psd) -->
|
<!-- Save for Web Slices (index.psd) -->
|
||||||
<table width="775" height="700" border="0" align="center" cellpadding="0" cellspacing="0" id="table_01">
|
<table width="775" height="700" border="0" align="center" cellpadding="0" cellspacing="0" id="table_01">
|
||||||
<tr>
|
<tr>
|
||||||
<td width="59" height="0" nowrap="nowrap"></td>
|
<td width="59" height="0" nowrap="nowrap"></td>
|
||||||
<td width="19" height="0" nowrap="nowrap"></td>
|
<td width="19" height="0" nowrap="nowrap"></td>
|
||||||
<td width="4" height="0" nowrap="nowrap"></td>
|
<td width="4" height="0" nowrap="nowrap"></td>
|
||||||
<td width="23" height="0" nowrap="nowrap"></td>
|
<td width="23" height="0" nowrap="nowrap"></td>
|
||||||
<td width="83" height="0" nowrap="nowrap"></td>
|
<td width="83" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="8" height="0" nowrap="nowrap"></td>
|
<td width="8" height="0" nowrap="nowrap"></td>
|
||||||
<td width="10" height="0" nowrap="nowrap"></td>
|
<td width="10" height="0" nowrap="nowrap"></td>
|
||||||
<td width="31" height="0" nowrap="nowrap"></td>
|
<td width="31" height="0" nowrap="nowrap"></td>
|
||||||
<td width="47" height="0" nowrap="nowrap"></td>
|
<td width="47" height="0" nowrap="nowrap"></td>
|
||||||
<td width="4" height="0" nowrap="nowrap"></td>
|
<td width="4" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="98" height="0" nowrap="nowrap"></td>
|
<td width="98" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="66" height="0" nowrap="nowrap"></td>
|
<td width="66" height="0" nowrap="nowrap"></td>
|
||||||
<td width="31" height="0" nowrap="nowrap"></td>
|
<td width="31" height="0" nowrap="nowrap"></td>
|
||||||
<td width="10" height="0" nowrap="nowrap"></td>
|
<td width="10" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="5" height="0" nowrap="nowrap"></td>
|
<td width="5" height="0" nowrap="nowrap"></td>
|
||||||
<td width="89" height="0" nowrap="nowrap"></td>
|
<td width="89" height="0" nowrap="nowrap"></td>
|
||||||
<td width="3" height="0" nowrap="nowrap"></td>
|
<td width="3" height="0" nowrap="nowrap"></td>
|
||||||
<td width="15" height="0" nowrap="nowrap"></td>
|
<td width="15" height="0" nowrap="nowrap"></td>
|
||||||
<td width="57" height="0" nowrap="nowrap"></td>
|
<td width="57" height="0" nowrap="nowrap"></td>
|
||||||
<td width="21" height="0" nowrap="nowrap"></td>
|
<td width="21" height="0" nowrap="nowrap"></td>
|
||||||
<td width="17" height="0" nowrap="nowrap"></td>
|
<td width="17" height="0" nowrap="nowrap"></td>
|
||||||
<td width="60" height="0" nowrap="nowrap"></td>
|
<td width="60" height="0" nowrap="nowrap"></td>
|
||||||
<td width="0" height="0"></td>
|
<td width="0" height="0"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="59" height="651" rowspan="15">
|
<td width="59" height="651" rowspan="15">
|
||||||
<img src="images/main.jpg" width="59" height="651" alt="" /></td>
|
<img src="images/main.jpg" width="59" height="651" alt="" /></td>
|
||||||
<td width="561" height="33" colspan="22" align="left" valign="middle" bgcolor="#efefef" class="text3" style="padding-left:20px">SEPTEMBER 29, 2009 </td>
|
<td width="561" height="33" colspan="22" align="left" valign="middle" bgcolor="#efefef" class="text3" style="padding-left:20px">SEPTEMBER 29, 2009 </td>
|
||||||
<td width="95" height="33" colspan="3" align="left" valign="top"><a href="#"><img src="images/client_login.jpg" alt="" width="95" height="33" border="0" /></a></td>
|
<td width="95" height="33" colspan="3" align="left" valign="top"><a href="#"><img src="images/client_login.jpg" alt="" width="95" height="33" border="0" /></a></td>
|
||||||
<td width="60" height="651" rowspan="15">
|
<td width="60" height="651" rowspan="15">
|
||||||
<img src="images/main-03.jpg" width="60" height="651" alt="" /></td>
|
<img src="images/main-03.jpg" width="60" height="651" alt="" /></td>
|
||||||
<td width="0" height="33" nowrap="nowrap"></td>
|
<td width="0" height="33" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="21" colspan="25" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
<td width="656" height="21" colspan="25" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
||||||
<td width="0" height="21" nowrap="nowrap"></td>
|
<td width="0" height="21" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="23" height="17" colspan="2" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
<td width="23" height="17" colspan="2" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
||||||
<td width="106" height="17" colspan="2" align="left" valign="top" bgcolor="#a7a7a7"><a href="index.html"><img src="images/btn_1.jpg" alt="" name="btn_1" width="106" height="17" border="0" id="btn_1" onmouseover="MM_swapImage('btn_1','','images/btn_1_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="106" height="17" colspan="2" align="left" valign="top" bgcolor="#a7a7a7"><a href="index.html"><img src="images/btn_1.jpg" alt="" name="btn_1" width="106" height="17" border="0" id="btn_1" onmouseover="MM_swapImage('btn_1','','images/btn_1_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
||||||
<img src="images/lines.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="100" height="17" colspan="5" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_2.jpg" alt="" name="btn_2" width="100" height="17" border="0" id="btn_2" onmouseover="MM_swapImage('btn_2','','images/btn_2_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="100" height="17" colspan="5" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_2.jpg" alt="" name="btn_2" width="100" height="17" border="0" id="btn_2" onmouseover="MM_swapImage('btn_2','','images/btn_2_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
||||||
<img src="images/lines-07.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-07.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="98" height="17" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_3.jpg" alt="" name="btn_3" width="98" height="17" border="0" id="btn_3" onmouseover="MM_swapImage('btn_3','','images/btn_3_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="98" height="17" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_3.jpg" alt="" name="btn_3" width="98" height="17" border="0" id="btn_3" onmouseover="MM_swapImage('btn_3','','images/btn_3_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
||||||
<img src="images/lines-09.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-09.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="107" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_4.jpg" alt="" name="btn_4" width="107" height="17" border="0" id="btn_4" onmouseover="MM_swapImage('btn_4','','images/btn_4_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="107" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_4.jpg" alt="" name="btn_4" width="107" height="17" border="0" id="btn_4" onmouseover="MM_swapImage('btn_4','','images/btn_4_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
||||||
<img src="images/lines-11.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-11.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="97" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_5.jpg" alt="" name="btn_5" width="97" height="17" border="0" id="btn_5" onmouseover="MM_swapImage('btn_5','','images/btn_5_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="97" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_5.jpg" alt="" name="btn_5" width="97" height="17" border="0" id="btn_5" onmouseover="MM_swapImage('btn_5','','images/btn_5_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#a7a7a7">
|
||||||
<img src="images/lines-13.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-13.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="93" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_6.jpg" alt="" name="btn_6" width="93" height="17" border="0" id="btn_6" onmouseover="MM_swapImage('btn_6','','images/btn_6_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="93" height="17" colspan="3" align="left" valign="top" bgcolor="#a7a7a7"><a href="contentpage.html"><img src="images/btn_6.jpg" alt="" name="btn_6" width="93" height="17" border="0" id="btn_6" onmouseover="MM_swapImage('btn_6','','images/btn_6_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="17" height="17" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
<td width="17" height="17" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
||||||
<td width="0" height="17" nowrap="nowrap"></td>
|
<td width="0" height="17" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="19" colspan="25" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
<td width="656" height="19" colspan="25" align="left" valign="top" nowrap="nowrap" bgcolor="#a7a7a7"></td>
|
||||||
<td width="0" height="19" nowrap="nowrap"></td>
|
<td width="0" height="19" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="240" colspan="25" align="left" valign="top">
|
<td width="656" height="240" colspan="25" align="left" valign="top">
|
||||||
<img src="images/main-15.jpg" width="656" height="240" alt="" /></td>
|
<img src="images/main-15.jpg" width="656" height="240" alt="" /></td>
|
||||||
<td width="0" height="240" nowrap="nowrap"></td>
|
<td width="0" height="240" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="321" colspan="25" rowspan="10" align="center" valign="middle" nowrap="nowrap" bgcolor="#efefef" class="text1">Content Page</td>
|
<td width="656" height="321" colspan="25" rowspan="10" align="center" valign="middle" nowrap="nowrap" bgcolor="#efefef" class="text1">Content Page</td>
|
||||||
<td width="0" height="7" nowrap="nowrap"></td>
|
<td width="0" height="7" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="43" nowrap="nowrap"></td>
|
<td width="0" height="43" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="56" nowrap="nowrap"></td>
|
<td width="0" height="56" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="26" nowrap="nowrap"></td>
|
<td width="0" height="26" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="12" nowrap="nowrap"></td>
|
<td width="0" height="12" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="17" nowrap="nowrap"></td>
|
<td width="0" height="17" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="23" nowrap="nowrap"></td>
|
<td width="0" height="23" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="22" nowrap="nowrap"></td>
|
<td width="0" height="22" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="58" nowrap="nowrap"></td>
|
<td width="0" height="58" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="0" height="57" nowrap="nowrap"></td>
|
<td width="0" height="57" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="775" height="49" colspan="27" align="center" valign="middle" class="text2" style="background:url(images/b_footer.jpg)"><a href="index.html">HOME</a> | <a href="contentpage.html">ABOUT US</a> | <a href="contentpage.html">SERVICES</a> | <a href="contentpage.html">SOLUTIONS</a> | <a href="contentpage.html">SUPPORT</a> | <a href="contentpage.html">CONTACTS</a><br />
|
<td width="775" height="49" colspan="27" align="center" valign="middle" class="text2" style="background:url(images/b_footer.jpg)"><a href="index.html">HOME</a> | <a href="contentpage.html">ABOUT US</a> | <a href="contentpage.html">SERVICES</a> | <a href="contentpage.html">SOLUTIONS</a> | <a href="contentpage.html">SUPPORT</a> | <a href="contentpage.html">CONTACTS</a><br />
|
||||||
<span class="text3">Copyright © Your Company Name</span><br/>
|
<span class="text3">Copyright © Your Company Name</span><br/>
|
||||||
Design by <a href="http://www.templatesbox.com" target="_blank" class="adv">Templates</a> Box. Create a <a href="http://www.wix.com" target="_blank" class="adv">free website</a>.
|
Design by <a href="http://www.templatesbox.com" target="_blank" class="adv">Templates</a> Box. Create a <a href="http://www.wix.com" target="_blank" class="adv">free website</a>.
|
||||||
</td>
|
</td>
|
||||||
<td width="0" height="49" nowrap="nowrap"></td>
|
<td width="0" height="49" nowrap="nowrap"></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<!-- End Save for Web Slices -->
|
<!-- End Save for Web Slices -->
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -1,160 +1,160 @@
|
|||||||
body{
|
body{
|
||||||
padding:0px;
|
padding:0px;
|
||||||
margin:0px;
|
margin:0px;
|
||||||
background:#c7c7c7;
|
background:#c7c7c7;
|
||||||
color:#848484;
|
color:#848484;
|
||||||
font:10px/14px Tahoma, sans-serif;
|
font:10px/14px Tahoma, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
div, p, ul, h2, h3, h4, img, form{padding:0px; margin:0px;}
|
div, p, ul, h2, h3, h4, img, form{padding:0px; margin:0px;}
|
||||||
ul{list-style-type:none;}
|
ul{list-style-type:none;}
|
||||||
|
|
||||||
.clear{
|
.clear{
|
||||||
clear:both;
|
clear:both;
|
||||||
}
|
}
|
||||||
|
|
||||||
.frame {
|
.frame {
|
||||||
border: 1px solid #D5E6E0;
|
border: 1px solid #D5E6E0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text1 {
|
.text1 {
|
||||||
font: 11px/14px "Trebuchet MS", Arial, Helvetica, sans-serif;
|
font: 11px/14px "Trebuchet MS", Arial, Helvetica, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
}
|
}
|
||||||
.text2 {
|
.text2 {
|
||||||
font: 11px/14px Tahoma, Geneva, sans-serif;
|
font: 11px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
}
|
}
|
||||||
.text3 {
|
.text3 {
|
||||||
font: 10px/14px Tahoma, Geneva, sans-serif;
|
font: 10px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text4 {
|
.text4 {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#052578;
|
color:#052578;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
}
|
}
|
||||||
.text5 {
|
.text5 {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#052578;
|
color:#052578;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
a:link {
|
a:link {
|
||||||
font: 11px/14px Tahoma, Geneva, sans-serif;
|
font: 11px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:visited{
|
a:visited{
|
||||||
font: 11px/14px Tahoma, Geneva, sans-serif;
|
font: 11px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
a:hover {
|
||||||
font: 11px/14px Tahoma, Geneva, sans-serif;
|
font: 11px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.a:link {
|
a.a:link {
|
||||||
font: 10px/14px Tahoma, Geneva, sans-serif;
|
font: 10px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#19a1cb;
|
color:#19a1cb;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.a:visited{
|
a.a:visited{
|
||||||
font: 10px/14px Tahoma, Geneva, sans-serif;
|
font: 10px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#19a1cb;
|
color:#19a1cb;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.a:hover {
|
a.a:hover {
|
||||||
font: 10px/14px Tahoma, Geneva, sans-serif;
|
font: 10px/14px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.b:link {
|
a.b:link {
|
||||||
font: 10px/18px Tahoma, Geneva, sans-serif;
|
font: 10px/18px Tahoma, Geneva, sans-serif;
|
||||||
color:#848484;
|
color:#848484;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.b:visited{
|
a.b:visited{
|
||||||
font: 10px/18px Tahoma, Geneva, sans-serif;
|
font: 10px/18px Tahoma, Geneva, sans-serif;
|
||||||
color:#848484;
|
color:#848484;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.b:hover {
|
a.b:hover {
|
||||||
font: 10px/18px Tahoma, Geneva, sans-serif;
|
font: 10px/18px Tahoma, Geneva, sans-serif;
|
||||||
color:#000;
|
color:#000;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.c:link {
|
a.c:link {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.c:visited{
|
a.c:visited{
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.c:hover {
|
a.c:hover {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.d:link {
|
a.d:link {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.d:visited{
|
a.d:visited{
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.d:hover {
|
a.d:hover {
|
||||||
font: 10px/12px Tahoma, Geneva, sans-serif;
|
font: 10px/12px Tahoma, Geneva, sans-serif;
|
||||||
color:#FFF;
|
color:#FFF;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
text-decoration:underline;
|
text-decoration:underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
input, textarea, select{
|
input, textarea, select{
|
||||||
border:#fff 1px solid;
|
border:#fff 1px solid;
|
||||||
background-color:#d6e6e0;
|
background-color:#d6e6e0;
|
||||||
font:10px/12px Tahoma, sans-serif; color:#000;
|
font:10px/12px Tahoma, sans-serif; color:#000;
|
||||||
}
|
}
|
||||||
a.adv:link {text-decoration: none; font-weight:bold; color:#000;}
|
a.adv:link {text-decoration: none; font-weight:bold; color:#000;}
|
||||||
a.adv:hover {text-decoration: none; font-weight:bold; color:#000;}
|
a.adv:hover {text-decoration: none; font-weight:bold; color:#000;}
|
||||||
a.adv:visited {text-decoration: none; font-weight:bold; color:#000;}
|
a.adv:visited {text-decoration: none; font-weight:bold; color:#000;}
|
||||||
|
|||||||
@@ -1,197 +1,197 @@
|
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||||
<head>
|
<head>
|
||||||
<title>Business Co.</title>
|
<title>Business Co.</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||||
|
|
||||||
<link href="css/styles.css" rel="stylesheet" type="text/css" />
|
<link href="css/styles.css" rel="stylesheet" type="text/css" />
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
<!--
|
<!--
|
||||||
function MM_preloadImages() { //v3.0
|
function MM_preloadImages() { //v3.0
|
||||||
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
|
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
|
||||||
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
|
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
|
||||||
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
|
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_swapImgRestore() { //v3.0
|
function MM_swapImgRestore() { //v3.0
|
||||||
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
|
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_findObj(n, d) { //v4.01
|
function MM_findObj(n, d) { //v4.01
|
||||||
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
|
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
|
||||||
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
|
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
|
||||||
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
|
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
|
||||||
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
|
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
|
||||||
if(!x && d.getElementById) x=d.getElementById(n); return x;
|
if(!x && d.getElementById) x=d.getElementById(n); return x;
|
||||||
}
|
}
|
||||||
|
|
||||||
function MM_swapImage() { //v3.0
|
function MM_swapImage() { //v3.0
|
||||||
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
|
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
|
||||||
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
|
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
|
||||||
}
|
}
|
||||||
//-->
|
//-->
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body onload="MM_preloadImages('images/btn_1_over.jpg','images/btn_2_over.jpg','images/btn_3_over.jpg','images/btn_4_over.jpg','images/btn_5_over.jpg', 'images/btn_6_over.jpg')">
|
<body onload="MM_preloadImages('images/btn_1_over.jpg','images/btn_2_over.jpg','images/btn_3_over.jpg','images/btn_4_over.jpg','images/btn_5_over.jpg', 'images/btn_6_over.jpg')">
|
||||||
<!-- Save for Web Slices (index.psd) -->
|
<!-- Save for Web Slices (index.psd) -->
|
||||||
<table width="775" height="700" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
|
<table width="775" height="700" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
|
||||||
<tr>
|
<tr>
|
||||||
<td width="59" height="0" nowrap></td>
|
<td width="59" height="0" nowrap></td>
|
||||||
<td width="19" height="0" nowrap></td>
|
<td width="19" height="0" nowrap></td>
|
||||||
<td width="4" height="0" nowrap></td>
|
<td width="4" height="0" nowrap></td>
|
||||||
<td width="23" height="0" nowrap></td>
|
<td width="23" height="0" nowrap></td>
|
||||||
<td width="83" height="0" nowrap></td>
|
<td width="83" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="8" height="0" nowrap></td>
|
<td width="8" height="0" nowrap></td>
|
||||||
<td width="10" height="0" nowrap></td>
|
<td width="10" height="0" nowrap></td>
|
||||||
<td width="31" height="0" nowrap></td>
|
<td width="31" height="0" nowrap></td>
|
||||||
<td width="47" height="0" nowrap></td>
|
<td width="47" height="0" nowrap></td>
|
||||||
<td width="4" height="0" nowrap></td>
|
<td width="4" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="98" height="0" nowrap></td>
|
<td width="98" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="66" height="0" nowrap></td>
|
<td width="66" height="0" nowrap></td>
|
||||||
<td width="31" height="0" nowrap></td>
|
<td width="31" height="0" nowrap></td>
|
||||||
<td width="10" height="0" nowrap></td>
|
<td width="10" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="5" height="0" nowrap></td>
|
<td width="5" height="0" nowrap></td>
|
||||||
<td width="89" height="0" nowrap></td>
|
<td width="89" height="0" nowrap></td>
|
||||||
<td width="3" height="0" nowrap></td>
|
<td width="3" height="0" nowrap></td>
|
||||||
<td width="15" height="0" nowrap></td>
|
<td width="15" height="0" nowrap></td>
|
||||||
<td width="57" height="0" nowrap></td>
|
<td width="57" height="0" nowrap></td>
|
||||||
<td width="21" height="0" nowrap></td>
|
<td width="21" height="0" nowrap></td>
|
||||||
<td width="17" height="0" nowrap></td>
|
<td width="17" height="0" nowrap></td>
|
||||||
<td width="60" height="0" nowrap></td>
|
<td width="60" height="0" nowrap></td>
|
||||||
<td width="0" height="0"></td>
|
<td width="0" height="0"></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="59" height="651" rowspan="15">
|
<td width="59" height="651" rowspan="15">
|
||||||
<img src="images/main.jpg" width="59" height="651" alt="" /></td>
|
<img src="images/main.jpg" width="59" height="651" alt="" /></td>
|
||||||
<td width="561" height="33" colspan="22" align="left" valign="middle" bgcolor="#EFEFEF" class="text3" style="padding-left:20px">SEPTEMBER 29, 2009 </td>
|
<td width="561" height="33" colspan="22" align="left" valign="middle" bgcolor="#EFEFEF" class="text3" style="padding-left:20px">SEPTEMBER 29, 2009 </td>
|
||||||
<td width="95" height="33" colspan="3" align="left" valign="top"><a href="#"><img src="images/client_login.jpg" alt="" width="95" height="33" border="0" /></a></td>
|
<td width="95" height="33" colspan="3" align="left" valign="top"><a href="#"><img src="images/client_login.jpg" alt="" width="95" height="33" border="0" /></a></td>
|
||||||
<td width="60" height="651" rowspan="15">
|
<td width="60" height="651" rowspan="15">
|
||||||
<img src="images/main-03.jpg" width="60" height="651" alt="" /></td>
|
<img src="images/main-03.jpg" width="60" height="651" alt="" /></td>
|
||||||
<td width="0" height="33" nowrap></td>
|
<td width="0" height="33" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="21" colspan="25" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
<td width="656" height="21" colspan="25" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
||||||
<td width="0" height="21" nowrap></td>
|
<td width="0" height="21" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="23" height="17" colspan="2" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
<td width="23" height="17" colspan="2" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
||||||
<td width="106" height="17" colspan="2" align="left" valign="top" bgcolor="#A7A7A7"><a href="index.html"><img src="images/btn_1.jpg" alt="" name="btn_1" width="106" height="17" border="0" id="btn_1" onmouseover="MM_swapImage('btn_1','','images/btn_1_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="106" height="17" colspan="2" align="left" valign="top" bgcolor="#A7A7A7"><a href="index.html"><img src="images/btn_1.jpg" alt="" name="btn_1" width="106" height="17" border="0" id="btn_1" onmouseover="MM_swapImage('btn_1','','images/btn_1_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
||||||
<img src="images/lines.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="100" height="17" colspan="5" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_2.jpg" alt="" name="btn_2" width="100" height="17" border="0" id="btn_2" onmouseover="MM_swapImage('btn_2','','images/btn_2_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="100" height="17" colspan="5" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_2.jpg" alt="" name="btn_2" width="100" height="17" border="0" id="btn_2" onmouseover="MM_swapImage('btn_2','','images/btn_2_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
||||||
<img src="images/lines-07.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-07.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="98" height="17" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_3.jpg" alt="" name="btn_3" width="98" height="17" border="0" id="btn_3" onmouseover="MM_swapImage('btn_3','','images/btn_3_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="98" height="17" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_3.jpg" alt="" name="btn_3" width="98" height="17" border="0" id="btn_3" onmouseover="MM_swapImage('btn_3','','images/btn_3_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
||||||
<img src="images/lines-09.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-09.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="107" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_4.jpg" alt="" name="btn_4" width="107" height="17" border="0" id="btn_4" onmouseover="MM_swapImage('btn_4','','images/btn_4_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="107" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_4.jpg" alt="" name="btn_4" width="107" height="17" border="0" id="btn_4" onmouseover="MM_swapImage('btn_4','','images/btn_4_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
||||||
<img src="images/lines-11.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-11.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="97" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_5.jpg" alt="" name="btn_5" width="97" height="17" border="0" id="btn_5" onmouseover="MM_swapImage('btn_5','','images/btn_5_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="97" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_5.jpg" alt="" name="btn_5" width="97" height="17" border="0" id="btn_5" onmouseover="MM_swapImage('btn_5','','images/btn_5_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
<td width="3" height="17" align="left" valign="top" bgcolor="#A7A7A7">
|
||||||
<img src="images/lines-13.jpg" width="3" height="17" alt="" /></td>
|
<img src="images/lines-13.jpg" width="3" height="17" alt="" /></td>
|
||||||
<td width="93" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_6.jpg" alt="" name="btn_6" width="93" height="17" border="0" id="btn_6" onmouseover="MM_swapImage('btn_6','','images/btn_6_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
<td width="93" height="17" colspan="3" align="left" valign="top" bgcolor="#A7A7A7"><a href="contentpage.html"><img src="images/btn_6.jpg" alt="" name="btn_6" width="93" height="17" border="0" id="btn_6" onmouseover="MM_swapImage('btn_6','','images/btn_6_over.jpg',1)" onmouseout="MM_swapImgRestore()"/></a></td>
|
||||||
<td width="17" height="17" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
<td width="17" height="17" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
||||||
<td width="0" height="17" nowrap></td>
|
<td width="0" height="17" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="19" colspan="25" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
<td width="656" height="19" colspan="25" align="left" valign="top" nowrap bgcolor="#A7A7A7"></td>
|
||||||
<td width="0" height="19" nowrap></td>
|
<td width="0" height="19" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="240" colspan="25" align="left" valign="top">
|
<td width="656" height="240" colspan="25" align="left" valign="top">
|
||||||
<img src="images/main-15.jpg" width="656" height="240" alt="" /></td>
|
<img src="images/main-15.jpg" width="656" height="240" alt="" /></td>
|
||||||
<td width="0" height="240" nowrap></td>
|
<td width="0" height="240" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="656" height="7" colspan="25" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="656" height="7" colspan="25" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="0" height="7" nowrap></td>
|
<td width="0" height="7" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="19" height="314" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="19" height="314" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="209" height="43" colspan="8" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="209" height="43" colspan="8" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/welcome.jpg" width="209" height="43" alt="" /></td>
|
<img src="images/welcome.jpg" width="209" height="43" alt="" /></td>
|
||||||
<td width="174" height="43" colspan="5" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="174" height="43" colspan="5" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="31" height="314" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="31" height="314" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="185" height="43" colspan="8" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="185" height="43" colspan="8" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/news.jpg" width="185" height="43" alt="" /></td>
|
<img src="images/news.jpg" width="185" height="43" alt="" /></td>
|
||||||
<td width="38" height="314" colspan="2" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="38" height="314" colspan="2" rowspan="9" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="0" height="43" nowrap></td>
|
<td width="0" height="43" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="121" height="82" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="121" height="82" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/welcome-18.jpg" width="121" height="82" alt="" /></td>
|
<img src="images/welcome-18.jpg" width="121" height="82" alt="" /></td>
|
||||||
<td width="10" height="94" rowspan="3" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="10" height="94" rowspan="3" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="252" height="94" colspan="7" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF"><span class="text1">Lorem ipsum dolor sit amet, consectetuer</span><br />
|
<td width="252" height="94" colspan="7" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF"><span class="text1">Lorem ipsum dolor sit amet, consectetuer</span><br />
|
||||||
Nam eu nulla. Donec lobortis purus vel urna. Nunc laoreet lacinia nunc. In volutpat sodales ipsum. Sed vestibulum. <a href="#" class="a">Integer in ante. Sed posuere ligula</a> rhoncus erat. Fusce urna dui, sollicitudin ac, pulvinar quis</td>
|
Nam eu nulla. Donec lobortis purus vel urna. Nunc laoreet lacinia nunc. In volutpat sodales ipsum. Sed vestibulum. <a href="#" class="a">Integer in ante. Sed posuere ligula</a> rhoncus erat. Fusce urna dui, sollicitudin ac, pulvinar quis</td>
|
||||||
<td width="21" height="56" colspan="4" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="21" height="56" colspan="4" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/news-19.jpg" width="21" height="56" alt="" /></td>
|
<img src="images/news-19.jpg" width="21" height="56" alt="" /></td>
|
||||||
<td width="164" height="56" colspan="4" align="left" valign="top" bgcolor="#EFEFEF" style="padding-top:5px"><p class="text1">September 29
|
<td width="164" height="56" colspan="4" align="left" valign="top" bgcolor="#EFEFEF" style="padding-top:5px"><p class="text1">September 29
|
||||||
</p>
|
</p>
|
||||||
<p><a href="#" class="a">Integer in ante. Sed posuere ligula </a>rhoncus erat. Fusce urna dui </p></td>
|
<p><a href="#" class="a">Integer in ante. Sed posuere ligula </a>rhoncus erat. Fusce urna dui </p></td>
|
||||||
<td width="0" height="56" nowrap></td>
|
<td width="0" height="56" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="21" height="55" colspan="4" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF"><img src="images/news-20.jpg" width="21" height="55" alt="" /></td>
|
<td width="21" height="55" colspan="4" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF"><img src="images/news-20.jpg" width="21" height="55" alt="" /></td>
|
||||||
<td width="164" height="55" colspan="4" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF" style="padding-top:5px"><span class="text1">September 28
|
<td width="164" height="55" colspan="4" rowspan="3" align="left" valign="top" bgcolor="#EFEFEF" style="padding-top:5px"><span class="text1">September 28
|
||||||
</span><br />
|
</span><br />
|
||||||
<a href="#" class="a">Integer in ante. Sed posuere ligula</a> rhoncus erat. Fusce urna dui</td>
|
<a href="#" class="a">Integer in ante. Sed posuere ligula</a> rhoncus erat. Fusce urna dui</td>
|
||||||
<td width="0" height="26" nowrap></td>
|
<td width="0" height="26" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="121" height="12" colspan="5" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="121" height="12" colspan="5" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="0" height="12" nowrap></td>
|
<td width="0" height="12" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="162" height="40" colspan="7" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="162" height="40" colspan="7" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/services.jpg" width="162" height="40" alt="" /></td>
|
<img src="images/services.jpg" width="162" height="40" alt="" /></td>
|
||||||
<td width="221" height="40" colspan="6" rowspan="2" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="221" height="40" colspan="6" rowspan="2" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="0" height="17" nowrap></td>
|
<td width="0" height="17" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="185" height="45" colspan="8" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="185" height="45" colspan="8" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/spotlight.jpg" width="185" height="45" alt="" /></td>
|
<img src="images/spotlight.jpg" width="185" height="45" alt="" /></td>
|
||||||
<td width="0" height="23" nowrap></td>
|
<td width="0" height="23" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="121" height="80" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="121" height="80" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/services-23.jpg" width="121" height="80" alt="" /></td>
|
<img src="images/services-23.jpg" width="121" height="80" alt="" /></td>
|
||||||
<td width="10" height="80" rowspan="2" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
<td width="10" height="80" rowspan="2" align="left" valign="top" nowrap bgcolor="#EFEFEF"></td>
|
||||||
<td width="252" height="80" colspan="7" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF"><span class="text1">Lorem ipsum dolor sit amet, consectetuer</span><br />
|
<td width="252" height="80" colspan="7" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF"><span class="text1">Lorem ipsum dolor sit amet, consectetuer</span><br />
|
||||||
<a href="#" class="a">Nam eu nulla. Donec lobortis purus vel urna. Nunc </a>laoreet lacinia nunc. In volutpat sodales ipsum. Sed vestibulum. rhoncus erat. Fusce urna dui, sollicitudin ac, pulvinar quis</td>
|
<a href="#" class="a">Nam eu nulla. Donec lobortis purus vel urna. Nunc </a>laoreet lacinia nunc. In volutpat sodales ipsum. Sed vestibulum. rhoncus erat. Fusce urna dui, sollicitudin ac, pulvinar quis</td>
|
||||||
<td width="0" height="22" nowrap></td>
|
<td width="0" height="22" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="16" height="115" colspan="3" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="16" height="115" colspan="3" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/spotlight-24.jpg" width="16" height="115" alt="" /></td>
|
<img src="images/spotlight-24.jpg" width="16" height="115" alt="" /></td>
|
||||||
<td width="169" height="115" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF" style="line-height:18px; padding-top:3px"><a href="#" class="b">Morbi volutpat leo in ligula. Inter vel</a><br />
|
<td width="169" height="115" colspan="5" rowspan="2" align="left" valign="top" bgcolor="#EFEFEF" style="line-height:18px; padding-top:3px"><a href="#" class="b">Morbi volutpat leo in ligula. Inter vel</a><br />
|
||||||
<a href="#" class="b">magna. sagittis. Fusce elit ligula, </a><br />
|
<a href="#" class="b">magna. sagittis. Fusce elit ligula, </a><br />
|
||||||
<a href="#" class="b">sodales sit amet, tincid unt in, Fusce </a><br />
|
<a href="#" class="b">sodales sit amet, tincid unt in, Fusce </a><br />
|
||||||
<a href="#" class="b">interdum. Sed laoreet. Aenean. Sed </a><br />
|
<a href="#" class="b">interdum. Sed laoreet. Aenean. Sed </a><br />
|
||||||
l<a href="#" class="b">aoreet. magna. sagittis. Fusce elit</a></td>
|
l<a href="#" class="b">aoreet. magna. sagittis. Fusce elit</a></td>
|
||||||
<td width="0" height="58" nowrap></td>
|
<td width="0" height="58" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="27" height="57" colspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
<td width="27" height="57" colspan="2" align="left" valign="top" bgcolor="#EFEFEF">
|
||||||
<img src="images/services-25.jpg" width="27" height="57" alt="" /></td>
|
<img src="images/services-25.jpg" width="27" height="57" alt="" /></td>
|
||||||
<td width="356" height="57" colspan="11" align="left" valign="top" bgcolor="#EFEFEF" style="line-height:18px; padding-top:8px"><a href="#" class="b">Morbi volutpat leo in ligula. Inter vel magna. sagittis. Fusce elit ligula, sodales </a><br />
|
<td width="356" height="57" colspan="11" align="left" valign="top" bgcolor="#EFEFEF" style="line-height:18px; padding-top:8px"><a href="#" class="b">Morbi volutpat leo in ligula. Inter vel magna. sagittis. Fusce elit ligula, sodales </a><br />
|
||||||
<a href="#" class="b">sit amet, tincid unt in, Fusce interdum. Sed laoreet. Aenean. Sed laoreet. </a></td>
|
<a href="#" class="b">sit amet, tincid unt in, Fusce interdum. Sed laoreet. Aenean. Sed laoreet. </a></td>
|
||||||
<td width="0" height="57" nowrap></td>
|
<td width="0" height="57" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td width="775" height="49" colspan="27" align="center" valign="middle" class="text2" style="background:url(images/b_footer.jpg)"><a href="index.html">HOME</a> | <a href="contentpage.html">ABOUT US</a> | <a href="contentpage.html">SERVICES</a> | <a href="contentpage.html">SOLUTIONS</a> | <a href="contentpage.html">SUPPORT</a> | <a href="contentpage.html">CONTACTS</a><br />
|
<td width="775" height="49" colspan="27" align="center" valign="middle" class="text2" style="background:url(images/b_footer.jpg)"><a href="index.html">HOME</a> | <a href="contentpage.html">ABOUT US</a> | <a href="contentpage.html">SERVICES</a> | <a href="contentpage.html">SOLUTIONS</a> | <a href="contentpage.html">SUPPORT</a> | <a href="contentpage.html">CONTACTS</a><br />
|
||||||
<span class="text3">Copyright © Your Company Name</span><br />
|
<span class="text3">Copyright © Your Company Name</span><br />
|
||||||
Design by <a href="http://www.templatesbox.com" target="_blank" class="adv">Templates</a> Box. Create a <a href="http://www.wix.com" target="_blank" class="adv">free website</a>.
|
Design by <a href="http://www.templatesbox.com" target="_blank" class="adv">Templates</a> Box. Create a <a href="http://www.wix.com" target="_blank" class="adv">free website</a>.
|
||||||
</td>
|
</td>
|
||||||
<td width="0" height="49" nowrap></td>
|
<td width="0" height="49" nowrap></td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<!-- End Save for Web Slices -->
|
<!-- End Save for Web Slices -->
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -1,86 +1,86 @@
|
|||||||
<!-- saved from url=(0022)http://internet.e-mail -->
|
<!-- saved from url=(0022)http://internet.e-mail -->
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>TemplatesBox.com | Terms of Use</title>
|
<title>TemplatesBox.com | Terms of Use</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body bgcolor="#5E717F" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
|
<body bgcolor="#5E717F" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
|
||||||
<table width="700" cellspacing="0" cellpadding="8" align="center" bgcolor="#BED5E2" style="border-collapse:collapse;">
|
<table width="700" cellspacing="0" cellpadding="8" align="center" bgcolor="#BED5E2" style="border-collapse:collapse;">
|
||||||
<tr>
|
<tr>
|
||||||
<td bgcolor="#567280" style="border-top-width:1px; border-right-width:1px; border-left-width:1px; border-top-color:rgb(216,216,216); border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-top-style:solid; border-right-style:solid; border-left-style:solid;"><font color="#C2DCEB" size="2" face="Verdana,Arial"><b>Templates</b></font><font color="#FF9900" size="2" face="Verdana,Arial"><b>Box</b></font><font color="#FF9B05" size="2" face="Verdana,Arial"><b>
|
<td bgcolor="#567280" style="border-top-width:1px; border-right-width:1px; border-left-width:1px; border-top-color:rgb(216,216,216); border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-top-style:solid; border-right-style:solid; border-left-style:solid;"><font color="#C2DCEB" size="2" face="Verdana,Arial"><b>Templates</b></font><font color="#FF9900" size="2" face="Verdana,Arial"><b>Box</b></font><font color="#FF9B05" size="2" face="Verdana,Arial"><b>
|
||||||
</b></font><font color="#E3E3E3" size="2" face="Verdana,Arial">|<b> Terms of Use</b></font></td>
|
</b></font><font color="#E3E3E3" size="2" face="Verdana,Arial">|<b> Terms of Use</b></font></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td bgcolor="#A1BBCA" style="border-right-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-left-style:solid;">
|
<td bgcolor="#A1BBCA" style="border-right-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-left-style:solid;">
|
||||||
<table align="center" cellpadding="0" cellspacing="0" width="98%">
|
<table align="center" cellpadding="0" cellspacing="0" width="98%">
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<p style="line-height:115%; margin-top:0; margin-bottom:0;"><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;">By
|
<p style="line-height:115%; margin-top:0; margin-bottom:0;"><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;">By
|
||||||
downloading a template from TemplatesBox.com you agree to the following
|
downloading a template from TemplatesBox.com you agree to the following
|
||||||
Terms of Use: </span></font>
|
Terms of Use: </span></font>
|
||||||
<p style="line-height:115%; margin-top:0; margin-bottom:0;"><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;">Our
|
<p style="line-height:115%; margin-top:0; margin-bottom:0;"><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;">Our
|
||||||
web templates may be used for your own and/or your clients' websites,
|
web templates may be used for your own and/or your clients' websites,
|
||||||
but you may not sell/offer for free our templates in any sort of collection,
|
but you may not sell/offer for free our templates in any sort of collection,
|
||||||
such as distributing to a third party via CD, diskette, or letting others
|
such as distributing to a third party via CD, diskette, or letting others
|
||||||
to download off your websites etc.<br>
|
to download off your websites etc.<br>
|
||||||
<br>
|
<br>
|
||||||
Link back to www.templatesbox.com is required and always appreciated.
|
Link back to www.templatesbox.com is required and always appreciated.
|
||||||
Also, please visit the<br>
|
Also, please visit the<br>
|
||||||
</span></font><a href="http://www.templatesbox.com/linkus.htm" target="_blank"><font face="Verdana,Arial" color="#354D59"><b><span style="font-size:8pt;">Link
|
</span></font><a href="http://www.templatesbox.com/linkus.htm" target="_blank"><font face="Verdana,Arial" color="#354D59"><b><span style="font-size:8pt;">Link
|
||||||
Us</span></b></font></a><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;"> section.<br>
|
Us</span></b></font></a><font face="Verdana,Arial" color="#354D59"><span style="font-size:8pt;"> section.<br>
|
||||||
<br>
|
<br>
|
||||||
The templates are offered "as is" without warranty of any kind,
|
The templates are offered "as is" without warranty of any kind,
|
||||||
either expressed or implied. TemplatesBox.com will not be liable for any
|
either expressed or implied. TemplatesBox.com will not be liable for any
|
||||||
damage or loss of data whatsoever due to downloading or using a template.
|
damage or loss of data whatsoever due to downloading or using a template.
|
||||||
In no event shall TemplatesBox.com be liable for any damages including,
|
In no event shall TemplatesBox.com be liable for any damages including,
|
||||||
but not limited to, direct, indirect, special, incidental or consequential
|
but not limited to, direct, indirect, special, incidental or consequential
|
||||||
damages or other losses arising out of the use of or inability to use
|
damages or other losses arising out of the use of or inability to use
|
||||||
the templates and/or information from TemplatesBox.com.<br>
|
the templates and/or information from TemplatesBox.com.<br>
|
||||||
<br>
|
<br>
|
||||||
TemplatesBox.com team reserves the right to change or modify these terms
|
TemplatesBox.com team reserves the right to change or modify these terms
|
||||||
with no prior notice.</span></font></p>
|
with no prior notice.</span></font></p>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td bgcolor="#567280" style="border-right-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-left-style:solid;"><font size="2" face="Verdana,Arial" color="#E3E3E3"><b>Featured
|
<td bgcolor="#567280" style="border-right-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-left-style:solid;"><font size="2" face="Verdana,Arial" color="#E3E3E3"><b>Featured
|
||||||
Partners</b></font></td>
|
Partners</b></font></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td bgcolor="#A1BBCA" style="border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-bottom-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-bottom-style:solid; border-left-style:solid;" height="235">
|
<td bgcolor="#A1BBCA" style="border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-right-color:rgb(216,216,216); border-bottom-color:rgb(216,216,216); border-left-color:rgb(216,216,216); border-right-style:solid; border-bottom-style:solid; border-left-style:solid;" height="235">
|
||||||
<table align="center" cellpadding="0" cellspacing="0" width="98%">
|
<table align="center" cellpadding="0" cellspacing="0" width="98%">
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<p><a href="http://www.specialtemplates.com" target="_blank"><b><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F">Premium Website
|
<p><a href="http://www.specialtemplates.com" target="_blank"><b><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F">Premium Website
|
||||||
Templates</font></b></a><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
Templates</font></b></a><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
||||||
Over 9000 High-end Website templates, Flash intros and Logo templates.<b><a href="http://www.freshtemplates.com" target="_blank"><br>
|
Over 9000 High-end Website templates, Flash intros and Logo templates.<b><a href="http://www.freshtemplates.com" target="_blank"><br>
|
||||||
<br>
|
<br>
|
||||||
</a></b></font><a href="http://www.freephotosbank.com" target="_blank"><b><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F">Free
|
</a></b></font><a href="http://www.freephotosbank.com" target="_blank"><b><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F">Free
|
||||||
Photos, Free Stock Photography</font></b></a><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><b><br></b>
|
Photos, Free Stock Photography</font></b></a><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><b><br></b>
|
||||||
</font><FONT face=Verdana color=#2d444f size=2><FONT size=2><FONT
|
</font><FONT face=Verdana color=#2d444f size=2><FONT size=2><FONT
|
||||||
face=Verdana><FONT color=#2d444f>1000's of FREE high quality stock
|
face=Verdana><FONT color=#2d444f>1000's of FREE high quality stock
|
||||||
Photos!</FONT></FONT></FONT></FONT><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
Photos!</FONT></FONT></FONT></FONT><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
||||||
<br>
|
<br>
|
||||||
</font><A
|
</font><A
|
||||||
href="http://www.webmasterschannel.com" target=_blank><FONT face=Verdana><FONT color=#2d444f><B><FONT size=2>Webmaster Resources &
|
href="http://www.webmasterschannel.com" target=_blank><FONT face=Verdana><FONT color=#2d444f><B><FONT size=2>Webmaster Resources &
|
||||||
Directory</FONT></B></FONT></FONT></A><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
Directory</FONT></B></FONT></FONT></A><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
||||||
</font><FONT size=2><FONT face=Verdana><FONT color=#2d444f>A large web directory with webmaster
|
</font><FONT size=2><FONT face=Verdana><FONT color=#2d444f>A large web directory with webmaster
|
||||||
resources.</FONT></FONT></FONT><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
resources.</FONT></FONT></FONT><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
||||||
<br>
|
<br>
|
||||||
</font><A href="http://www.photovations.com"
|
</font><A href="http://www.photovations.com"
|
||||||
target=_blank><FONT face=Verdana color=#000000
|
target=_blank><FONT face=Verdana color=#000000
|
||||||
size=2><FONT face=Verdana color=#2d444f size=2><STRONG>Photovations.com</STRONG></FONT></FONT></A><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
size=2><FONT face=Verdana color=#2d444f size=2><STRONG>Photovations.com</STRONG></FONT></FONT></A><font size="2" face="Verdana, Arial, Helvetica, sans-serif" color="#2D444F"><br>
|
||||||
</font><FONT face=Verdana color=#2d444f size=2><FONT size=2><FONT
|
</font><FONT face=Verdana color=#2d444f size=2><FONT size=2><FONT
|
||||||
face=Verdana><FONT color=#2d444f>Online Photo Sharing. Free Image
|
face=Verdana><FONT color=#2d444f>Online Photo Sharing. Free Image
|
||||||
Hosting</FONT></FONT></FONT></FONT></p>
|
Hosting</FONT></FONT></FONT></FONT></p>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
<html>
|
<html>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<h2>Norwegian Mountain Trip</h2>
|
<h2>Norwegian Mountain Trip</h2>
|
||||||
<img border="0" src="images/pulpit.jpg" alt="Pulpit rock" width="304" height="228" />
|
<img border="0" src="images/pulpit.jpg" alt="Pulpit rock" width="304" height="228" />
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
<html>
|
<html>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<h1>My First Heading</h1>
|
<h1>My First Heading</h1>
|
||||||
|
|
||||||
<p>My first paragraph.</p>
|
<p>My first paragraph.</p>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|||||||
@@ -1,99 +1,99 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset=utf-8 />
|
<meta charset=utf-8 />
|
||||||
<meta name="viewport" content="width=620" />
|
<meta name="viewport" content="width=620" />
|
||||||
<title>HTML5 Demo: data-*</title>
|
<title>HTML5 Demo: data-*</title>
|
||||||
<link rel="stylesheet" href="/css/html5demos.css" type="text/css" />
|
<link rel="stylesheet" href="/css/html5demos.css" type="text/css" />
|
||||||
<script src="/js/h5utils.js"></script></head>
|
<script src="/js/h5utils.js"></script></head>
|
||||||
<body>
|
<body>
|
||||||
<section id="wrapper">
|
<section id="wrapper">
|
||||||
<header>
|
<header>
|
||||||
<h1>data-*</h1>
|
<h1>data-*</h1>
|
||||||
</header><style>
|
</header><style>
|
||||||
#test {
|
#test {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
}
|
}
|
||||||
pre {
|
pre {
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border: 1px dashed #ccc;
|
border: 1px dashed #ccc;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<article>
|
<article>
|
||||||
<section>
|
<section>
|
||||||
<p>The <code>data-[name]</code> attribute on elements can now be accessed directly via the DOM using <code>element.dataset.[attr]</code>.</p>
|
<p>The <code>data-[name]</code> attribute on elements can now be accessed directly via the DOM using <code>element.dataset.[attr]</code>.</p>
|
||||||
<p>Try openning the Web Console and editing <code>element.dataset</code> directly: <br /><code>element.dataset.foo = 'bar';</code></p>
|
<p>Try openning the Web Console and editing <code>element.dataset</code> directly: <br /><code>element.dataset.foo = 'bar';</code></p>
|
||||||
</section>
|
</section>
|
||||||
<p id="status">Not connected</p>
|
<p id="status">Not connected</p>
|
||||||
<section>
|
<section>
|
||||||
<div id="test" data-name="rem" data-height="short">This element has data</div>
|
<div id="test" data-name="rem" data-height="short">This element has data</div>
|
||||||
<input type="button" value="Show data" id="show" />
|
<input type="button" value="Show data" id="show" />
|
||||||
<input type="button" value="Change data via dataset" id="change1" />
|
<input type="button" value="Change data via dataset" id="change1" />
|
||||||
<input type="button" value="change data via setAttribute" id="change2" />
|
<input type="button" value="change data via setAttribute" id="change2" />
|
||||||
</section>
|
</section>
|
||||||
<pre><code id="element">[click buttons above to show element html]</code></pre>
|
<pre><code id="element">[click buttons above to show element html]</code></pre>
|
||||||
</article>
|
</article>
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
|
|
||||||
function show() {
|
function show() {
|
||||||
code.innerHTML = test.outerHTML.replace(/[<>]/g, function (m) {
|
code.innerHTML = test.outerHTML.replace(/[<>]/g, function (m) {
|
||||||
return { '<': '<', '>': '>' }[m];
|
return { '<': '<', '>': '>' }[m];
|
||||||
});
|
});
|
||||||
|
|
||||||
for (var prop in test.dataset) {
|
for (var prop in test.dataset) {
|
||||||
code.innerHTML += '\nel.dataset.' + prop + ' = "' + test.dataset[prop] + '"';
|
code.innerHTML += '\nel.dataset.' + prop + ' = "' + test.dataset[prop] + '"';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
var state = document.getElementById('status'),
|
var state = document.getElementById('status'),
|
||||||
code = document.getElementById('element');
|
code = document.getElementById('element');
|
||||||
|
|
||||||
var test = window.element = document.getElementById('test');
|
var test = window.element = document.getElementById('test');
|
||||||
|
|
||||||
if (test.dataset === undefined) {
|
if (test.dataset === undefined) {
|
||||||
state.innerHTML = 'dataset not supported';
|
state.innerHTML = 'dataset not supported';
|
||||||
state.className = 'fail';
|
state.className = 'fail';
|
||||||
} else {
|
} else {
|
||||||
state.className = 'success';
|
state.className = 'success';
|
||||||
state.innerHTML = 'element.dataset supported';
|
state.innerHTML = 'element.dataset supported';
|
||||||
}
|
}
|
||||||
|
|
||||||
addEvent(document.getElementById('show'), 'click', function () {
|
addEvent(document.getElementById('show'), 'click', function () {
|
||||||
show();
|
show();
|
||||||
});
|
});
|
||||||
|
|
||||||
addEvent(document.getElementById('change1'), 'click', function () {
|
addEvent(document.getElementById('change1'), 'click', function () {
|
||||||
test.dataset.name = 'via el.dataset';
|
test.dataset.name = 'via el.dataset';
|
||||||
show();
|
show();
|
||||||
});
|
});
|
||||||
|
|
||||||
addEvent(document.getElementById('change2'), 'click', function () {
|
addEvent(document.getElementById('change2'), 'click', function () {
|
||||||
test.setAttribute('data-name', 'via setAttribute');
|
test.setAttribute('data-name', 'via setAttribute');
|
||||||
show();
|
show();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
<footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a>/<a href="#view-source">view source</a></footer>
|
<footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a>/<a href="#view-source">view source</a></footer>
|
||||||
</section>
|
</section>
|
||||||
<a href="http://github.com/remy/html5demos"><img style="position: absolute; top: 0; left: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub" /></a>
|
<a href="http://github.com/remy/html5demos"><img style="position: absolute; top: 0; left: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub" /></a>
|
||||||
<script src="/js/prettify.packed.js"></script>
|
<script src="/js/prettify.packed.js"></script>
|
||||||
<script>
|
<script>
|
||||||
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
|
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
|
||||||
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
|
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
|
||||||
</script>
|
</script>
|
||||||
<script>
|
<script>
|
||||||
try {
|
try {
|
||||||
var pageTracker = _gat._getTracker("UA-1656750-18");
|
var pageTracker = _gat._getTracker("UA-1656750-18");
|
||||||
pageTracker._trackPageview();
|
pageTracker._trackPageview();
|
||||||
} catch(err) {}</script>
|
} catch(err) {}</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -1,149 +1,149 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {HTTP_CONSTANTS}."
|
description: "Summary description for {HTTP_CONSTANTS}."
|
||||||
author: ""
|
author: ""
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
HTTP_CONSTANTS
|
HTTP_CONSTANTS
|
||||||
|
|
||||||
feature
|
feature
|
||||||
|
|
||||||
http_version_1_1: STRING = "HTTP/1.1"
|
http_version_1_1: STRING = "HTTP/1.1"
|
||||||
http_version_1_0: STRING = "HTTP/1.0"
|
http_version_1_0: STRING = "HTTP/1.0"
|
||||||
crlf: STRING = "%/13/%/10/"
|
crlf: STRING = "%/13/%/10/"
|
||||||
|
|
||||||
feature -- Status codes
|
feature -- Status codes
|
||||||
|
|
||||||
-- 1xx Informational -Request received, continuing process
|
-- 1xx Informational -Request received, continuing process
|
||||||
Continue : STRING = "100"
|
Continue : STRING = "100"
|
||||||
Switching_Protocols : STRING = "101"
|
Switching_Protocols : STRING = "101"
|
||||||
|
|
||||||
|
|
||||||
-- 2xx Success - The action was successfully received, understood, and accepted
|
-- 2xx Success - The action was successfully received, understood, and accepted
|
||||||
Ok: STRING = "200"
|
Ok: STRING = "200"
|
||||||
Created : STRING = "201"
|
Created : STRING = "201"
|
||||||
Accepted : STRING = "202"
|
Accepted : STRING = "202"
|
||||||
Non_Authoritative_Information : STRING = "203"
|
Non_Authoritative_Information : STRING = "203"
|
||||||
No_Content : STRING = "204"
|
No_Content : STRING = "204"
|
||||||
Reset_Content : STRING = "205"
|
Reset_Content : STRING = "205"
|
||||||
Parcial_Content : STRING = "206"
|
Parcial_Content : STRING = "206"
|
||||||
|
|
||||||
|
|
||||||
-- 3xx Redirection - Further Action must be taken in order to complete the request
|
-- 3xx Redirection - Further Action must be taken in order to complete the request
|
||||||
Multiple_Choices : STRING = "300"
|
Multiple_Choices : STRING = "300"
|
||||||
Moved_Permanently: STRING = "301"
|
Moved_Permanently: STRING = "301"
|
||||||
Found : STRING = "302"
|
Found : STRING = "302"
|
||||||
See_Other : STRING = "303"
|
See_Other : STRING = "303"
|
||||||
Not_Modified : STRING = "304"
|
Not_Modified : STRING = "304"
|
||||||
Use_Proxy : STRING = "305"
|
Use_Proxy : STRING = "305"
|
||||||
Temporary_Redirect : STRING = "307"
|
Temporary_Redirect : STRING = "307"
|
||||||
|
|
||||||
|
|
||||||
--4xx Client Error - The request contains bad syntax or cannot be fulfilled
|
--4xx Client Error - The request contains bad syntax or cannot be fulfilled
|
||||||
Bad_Request : STRING = "400"
|
Bad_Request : STRING = "400"
|
||||||
Unauthorized : STRING = "401"
|
Unauthorized : STRING = "401"
|
||||||
Payment_Required : STRING = "402"
|
Payment_Required : STRING = "402"
|
||||||
Forbidden : STRING = "403"
|
Forbidden : STRING = "403"
|
||||||
Not_Found : STRING = "404"
|
Not_Found : STRING = "404"
|
||||||
Method_Not_Allowed : STRING = "405"
|
Method_Not_Allowed : STRING = "405"
|
||||||
Not_Acceptable : STRING = "406"
|
Not_Acceptable : STRING = "406"
|
||||||
Proxy_Authentication_Required : STRING = "407"
|
Proxy_Authentication_Required : STRING = "407"
|
||||||
Request_Time_out : STRING = "408"
|
Request_Time_out : STRING = "408"
|
||||||
Conflict : STRING = "409"
|
Conflict : STRING = "409"
|
||||||
Gone : STRING = "410"
|
Gone : STRING = "410"
|
||||||
Length_Required : STRING = "411"
|
Length_Required : STRING = "411"
|
||||||
Precondition_Failed : STRING = "412"
|
Precondition_Failed : STRING = "412"
|
||||||
Request_Entity_Too_Large : STRING = "413"
|
Request_Entity_Too_Large : STRING = "413"
|
||||||
Request_URI_Too_Large : STRING = "414"
|
Request_URI_Too_Large : STRING = "414"
|
||||||
Unsupported_Media_Type : STRING = "415"
|
Unsupported_Media_Type : STRING = "415"
|
||||||
Requested_range_not_satisfiable : STRING = "416"
|
Requested_range_not_satisfiable : STRING = "416"
|
||||||
Expectation_Failed : STRING = "417"
|
Expectation_Failed : STRING = "417"
|
||||||
|
|
||||||
|
|
||||||
--5xx Server Error - The server failed to fulfill an apparently valid request
|
--5xx Server Error - The server failed to fulfill an apparently valid request
|
||||||
server_error: STRING = "500"
|
server_error: STRING = "500"
|
||||||
Internal_Server_Error : STRING = "500"
|
Internal_Server_Error : STRING = "500"
|
||||||
Not_Implemented : STRING = "501"
|
Not_Implemented : STRING = "501"
|
||||||
Bad_Gateway : STRING = "502"
|
Bad_Gateway : STRING = "502"
|
||||||
Service_Unavailable : STRING = "503"
|
Service_Unavailable : STRING = "503"
|
||||||
Gateway_Time_out : STRING = "504"
|
Gateway_Time_out : STRING = "504"
|
||||||
HTTP_Version_not_supported : STRING = "505"
|
HTTP_Version_not_supported : STRING = "505"
|
||||||
|
|
||||||
|
|
||||||
-- messages
|
-- messages
|
||||||
ok_message: STRING = "OK"
|
ok_message: STRING = "OK"
|
||||||
continue_message : STRING = "Continue"
|
continue_message : STRING = "Continue"
|
||||||
not_found_message: STRING = "URI not found"
|
not_found_message: STRING = "URI not found"
|
||||||
not_implemented_message: STRING = "Not Implemented"
|
not_implemented_message: STRING = "Not Implemented"
|
||||||
|
|
||||||
feature -- content types
|
feature -- content types
|
||||||
|
|
||||||
text_html: STRING = "text/html"
|
text_html: STRING = "text/html"
|
||||||
|
|
||||||
feature -- General Header Fields
|
feature -- General Header Fields
|
||||||
|
|
||||||
-- There are a few header fields which have general applicability for both request and response messages,
|
-- There are a few header fields which have general applicability for both request and response messages,
|
||||||
-- but which do not apply to the entity being transferred.
|
-- but which do not apply to the entity being transferred.
|
||||||
-- These header fields apply only to the message being transmitted.
|
-- These header fields apply only to the message being transmitted.
|
||||||
|
|
||||||
Cache_control : STRING = "Cache-Control"
|
Cache_control : STRING = "Cache-Control"
|
||||||
Connection : STRING = "Connection"
|
Connection : STRING = "Connection"
|
||||||
Date : STRING = "Date"
|
Date : STRING = "Date"
|
||||||
Pragma : STRING = "PRAGMA"
|
Pragma : STRING = "PRAGMA"
|
||||||
Trailer : STRING = "Trailer"
|
Trailer : STRING = "Trailer"
|
||||||
Transfer_encoding : STRING = "Transfer-Encoding"
|
Transfer_encoding : STRING = "Transfer-Encoding"
|
||||||
Upgrade : STRING = "Upgrade"
|
Upgrade : STRING = "Upgrade"
|
||||||
Via : STRING = "Via"
|
Via : STRING = "Via"
|
||||||
Warning : STRING = "Warning"
|
Warning : STRING = "Warning"
|
||||||
|
|
||||||
|
|
||||||
feature -- Request Header
|
feature -- Request Header
|
||||||
Accept : STRING = "Accept"
|
Accept : STRING = "Accept"
|
||||||
Accept_charset : STRING = "Accept-Charset"
|
Accept_charset : STRING = "Accept-Charset"
|
||||||
Accept_encoding : STRING = "Accept-Encoding"
|
Accept_encoding : STRING = "Accept-Encoding"
|
||||||
Accept_language : STRING = "Accept-Language"
|
Accept_language : STRING = "Accept-Language"
|
||||||
Authorization : STRING = "Authorization"
|
Authorization : STRING = "Authorization"
|
||||||
Expect : STRING = "Expect"
|
Expect : STRING = "Expect"
|
||||||
From_header : STRING = "From"
|
From_header : STRING = "From"
|
||||||
Host : STRING = "Host"
|
Host : STRING = "Host"
|
||||||
If_match : STRING = "If-Match"
|
If_match : STRING = "If-Match"
|
||||||
If_modified_since : STRING = "If-Modified-Since"
|
If_modified_since : STRING = "If-Modified-Since"
|
||||||
If_none_match : STRING = "If-None-Match"
|
If_none_match : STRING = "If-None-Match"
|
||||||
If_range : STRING = "If-Range"
|
If_range : STRING = "If-Range"
|
||||||
If_unmodified_since : STRING = "If-Unmodified-Since"
|
If_unmodified_since : STRING = "If-Unmodified-Since"
|
||||||
Max_forwards : STRING = "Max-Forwards"
|
Max_forwards : STRING = "Max-Forwards"
|
||||||
Proxy_authorization : STRING = "Proxy-Authorization"
|
Proxy_authorization : STRING = "Proxy-Authorization"
|
||||||
Range : STRING = "Range"
|
Range : STRING = "Range"
|
||||||
Referer : STRING = "Referrer"
|
Referer : STRING = "Referrer"
|
||||||
TE : STRING = "TE"
|
TE : STRING = "TE"
|
||||||
User_agent : STRING = "User-Agent"
|
User_agent : STRING = "User-Agent"
|
||||||
|
|
||||||
|
|
||||||
feature -- Entity Header
|
feature -- Entity Header
|
||||||
|
|
||||||
Allow : STRING = "Allow"
|
Allow : STRING = "Allow"
|
||||||
Content_encoding : STRING = "Content-Encoding"
|
Content_encoding : STRING = "Content-Encoding"
|
||||||
Content_language : STRING = "Content-Language"
|
Content_language : STRING = "Content-Language"
|
||||||
Content_length : STRING = "Content-Length"
|
Content_length : STRING = "Content-Length"
|
||||||
Content_location : STRING = "Content-Location"
|
Content_location : STRING = "Content-Location"
|
||||||
Content_MD5 : STRING = "Content-MD5"
|
Content_MD5 : STRING = "Content-MD5"
|
||||||
Content_range : STRING = "Content-Range"
|
Content_range : STRING = "Content-Range"
|
||||||
Content_type : STRING = "Content-Type"
|
Content_type : STRING = "Content-Type"
|
||||||
Expires : STRING = "Expires"
|
Expires : STRING = "Expires"
|
||||||
Last_modified : STRING = "Last-Modified"
|
Last_modified : STRING = "Last-Modified"
|
||||||
|
|
||||||
|
|
||||||
feature -- Http Method
|
feature -- Http Method
|
||||||
Options : STRING = "OPTIONS"
|
Options : STRING = "OPTIONS"
|
||||||
Get : STRING = "GET"
|
Get : STRING = "GET"
|
||||||
Head : STRING = "HEAD"
|
Head : STRING = "HEAD"
|
||||||
Post : STRING = "POST"
|
Post : STRING = "POST"
|
||||||
Put : STRING = "PUT"
|
Put : STRING = "PUT"
|
||||||
Delete : STRING = "DELETE"
|
Delete : STRING = "DELETE"
|
||||||
Trace : STRING = "TRACE"
|
Trace : STRING = "TRACE"
|
||||||
Connect : STRING = "CONNECT"
|
Connect : STRING = "CONNECT"
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,60 +1,60 @@
|
|||||||
note
|
note
|
||||||
description: "[
|
description: "[
|
||||||
Provides features to encode and decode messages
|
Provides features to encode and decode messages
|
||||||
]"
|
]"
|
||||||
legal: "See notice at end of class."
|
legal: "See notice at end of class."
|
||||||
status: "Community Preview 1.0"
|
status: "Community Preview 1.0"
|
||||||
date: "$Date: 2009-09-01 19:15:37 -0300 (mar 01 de sep de 2009) $"
|
date: "$Date: 2009-09-01 19:15:37 -0300 (mar 01 de sep de 2009) $"
|
||||||
revision: "$Revision: 80577 $"
|
revision: "$Revision: 80577 $"
|
||||||
|
|
||||||
class
|
class
|
||||||
HTTP_ENCODING_FACILITIES
|
HTTP_ENCODING_FACILITIES
|
||||||
|
|
||||||
create
|
create
|
||||||
make
|
make
|
||||||
|
|
||||||
feature -- Initialization
|
feature -- Initialization
|
||||||
|
|
||||||
make
|
make
|
||||||
do
|
do
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Conversion
|
feature -- Conversion
|
||||||
|
|
||||||
encode_natural(a_i: NATURAL; a_is_fragmented: BOOLEAN): NATURAL
|
encode_natural(a_i: NATURAL; a_is_fragmented: BOOLEAN): NATURAL
|
||||||
-- Leftshift of the natural (don't use numbers >= 2^31) and subsequent append of the flag bit.
|
-- Leftshift of the natural (don't use numbers >= 2^31) and subsequent append of the flag bit.
|
||||||
-- Use decode_natural and decode_flag for decoding.
|
-- Use decode_natural and decode_flag for decoding.
|
||||||
require
|
require
|
||||||
no_too_big: a_i < 2147483648
|
no_too_big: a_i < 2147483648
|
||||||
do
|
do
|
||||||
Result := (a_i |<< 1) + a_is_fragmented.to_integer.as_natural_32
|
Result := (a_i |<< 1) + a_is_fragmented.to_integer.as_natural_32
|
||||||
end
|
end
|
||||||
|
|
||||||
change_flag(a_i: NATURAL; a_new_flag: BOOLEAN): NATURAL
|
change_flag(a_i: NATURAL; a_new_flag: BOOLEAN): NATURAL
|
||||||
-- Changes the flag to "new_flag" and doesn't change the encoded natural.
|
-- Changes the flag to "new_flag" and doesn't change the encoded natural.
|
||||||
do
|
do
|
||||||
Result := (a_i & 0xFFFFFFFE) + a_new_flag.to_integer.as_natural_32
|
Result := (a_i & 0xFFFFFFFE) + a_new_flag.to_integer.as_natural_32
|
||||||
end
|
end
|
||||||
|
|
||||||
decode_natural_and_flag (a_i: NATURAL): TUPLE [NATURAL, BOOLEAN]
|
decode_natural_and_flag (a_i: NATURAL): TUPLE [NATURAL, BOOLEAN]
|
||||||
-- Convenience feature which combines both decodings (natural and flag)
|
-- Convenience feature which combines both decodings (natural and flag)
|
||||||
do
|
do
|
||||||
Result := [decode_natural (a_i), decode_flag (a_i)]
|
Result := [decode_natural (a_i), decode_flag (a_i)]
|
||||||
end
|
end
|
||||||
|
|
||||||
decode_natural (a_i: NATURAL): NATURAL
|
decode_natural (a_i: NATURAL): NATURAL
|
||||||
-- The natural that was encoded in {ENCODING_FACILITIES}.encode_natural.
|
-- The natural that was encoded in {ENCODING_FACILITIES}.encode_natural.
|
||||||
do
|
do
|
||||||
Result := (a_i |>> 1)
|
Result := (a_i |>> 1)
|
||||||
end
|
end
|
||||||
|
|
||||||
decode_flag (a_i: NATURAL): BOOLEAN
|
decode_flag (a_i: NATURAL): BOOLEAN
|
||||||
--`Result': the flag that was encoded in encode_natural
|
--`Result': the flag that was encoded in encode_natural
|
||||||
do
|
do
|
||||||
Result := (a_i.bit_and (1) = 1)
|
Result := (a_i.bit_and (1) = 1)
|
||||||
end
|
end
|
||||||
|
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,56 +1,56 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {HTTP_SERVER}."
|
description: "Summary description for {HTTP_SERVER}."
|
||||||
author: ""
|
author: ""
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
HTTP_SERVER
|
HTTP_SERVER
|
||||||
|
|
||||||
create
|
create
|
||||||
make
|
make
|
||||||
|
|
||||||
feature -- Initialization
|
feature -- Initialization
|
||||||
|
|
||||||
make (cfg: like configuration)
|
make (cfg: like configuration)
|
||||||
do
|
do
|
||||||
configuration := cfg
|
configuration := cfg
|
||||||
end
|
end
|
||||||
|
|
||||||
setup (a_http_handler: HTTP_HANDLER)
|
setup (a_http_handler: HTTP_HANDLER)
|
||||||
require
|
require
|
||||||
a_http_handler_valid: a_http_handler /= Void
|
a_http_handler_valid: a_http_handler /= Void
|
||||||
do
|
do
|
||||||
if configuration.is_verbose then
|
if configuration.is_verbose then
|
||||||
log ("%N%N%N")
|
log ("%N%N%N")
|
||||||
log ("Starting Web Application Server (port="+ configuration.http_server_port.out +"):%N")
|
log ("Starting Web Application Server (port="+ configuration.http_server_port.out +"):%N")
|
||||||
end
|
end
|
||||||
stop_requested := False
|
stop_requested := False
|
||||||
a_http_handler.execute
|
a_http_handler.execute
|
||||||
end
|
end
|
||||||
|
|
||||||
shutdown_server
|
shutdown_server
|
||||||
do
|
do
|
||||||
stop_requested := True
|
stop_requested := True
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Access
|
feature -- Access
|
||||||
|
|
||||||
configuration: HTTP_SERVER_CONFIGURATION
|
configuration: HTTP_SERVER_CONFIGURATION
|
||||||
-- Configuration of the server
|
-- Configuration of the server
|
||||||
|
|
||||||
stop_requested: BOOLEAN
|
stop_requested: BOOLEAN
|
||||||
-- Stops the server
|
-- Stops the server
|
||||||
|
|
||||||
feature -- Output
|
feature -- Output
|
||||||
|
|
||||||
log (a_message: READABLE_STRING_8)
|
log (a_message: READABLE_STRING_8)
|
||||||
-- Log `a_message'
|
-- Log `a_message'
|
||||||
do
|
do
|
||||||
io.put_string (a_message)
|
io.put_string (a_message)
|
||||||
end
|
end
|
||||||
|
|
||||||
;note
|
;note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,118 +1,118 @@
|
|||||||
deferred class HTTP_REQUEST_HANDLER
|
deferred class HTTP_REQUEST_HANDLER
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
ANY
|
ANY
|
||||||
redefine
|
redefine
|
||||||
default_create
|
default_create
|
||||||
end
|
end
|
||||||
|
|
||||||
feature {NONE} -- Initialization
|
feature {NONE} -- Initialization
|
||||||
|
|
||||||
default_create
|
default_create
|
||||||
do
|
do
|
||||||
Precursor
|
Precursor
|
||||||
create request_uri.make_empty
|
create request_uri.make_empty
|
||||||
create script_name.make_empty
|
create script_name.make_empty
|
||||||
create query_string.make_empty
|
create query_string.make_empty
|
||||||
create answer
|
create answer
|
||||||
create headers.make (0)
|
create headers.make (0)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Access
|
feature -- Access
|
||||||
|
|
||||||
request_uri: STRING
|
request_uri: STRING
|
||||||
-- requested url
|
-- requested url
|
||||||
|
|
||||||
script_name: STRING
|
script_name: STRING
|
||||||
-- Script name
|
-- Script name
|
||||||
|
|
||||||
query_string: STRING
|
query_string: STRING
|
||||||
-- Query string
|
-- Query string
|
||||||
|
|
||||||
data: detachable STRING
|
data: detachable STRING
|
||||||
-- the entire request message
|
-- the entire request message
|
||||||
|
|
||||||
headers : HASH_TABLE [STRING, STRING]
|
headers : HASH_TABLE [STRING, STRING]
|
||||||
-- Provides access to the request's HTTP headers, for example:
|
-- Provides access to the request's HTTP headers, for example:
|
||||||
-- headers["Content-Type"] is "text/plain"
|
-- headers["Content-Type"] is "text/plain"
|
||||||
|
|
||||||
answer: HTTP_RESPONSE
|
answer: HTTP_RESPONSE
|
||||||
-- reply to this request
|
-- reply to this request
|
||||||
|
|
||||||
feature -- Execution
|
feature -- Execution
|
||||||
|
|
||||||
process
|
process
|
||||||
-- process the request and create an answer
|
-- process the request and create an answer
|
||||||
require
|
require
|
||||||
valid_uri: request_uri /= Void
|
valid_uri: request_uri /= Void
|
||||||
deferred
|
deferred
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Recycle
|
feature -- Recycle
|
||||||
|
|
||||||
reset
|
reset
|
||||||
-- reinit the fields
|
-- reinit the fields
|
||||||
do
|
do
|
||||||
request_uri.wipe_out
|
request_uri.wipe_out
|
||||||
script_name.wipe_out
|
script_name.wipe_out
|
||||||
query_string.wipe_out
|
query_string.wipe_out
|
||||||
data := Void
|
data := Void
|
||||||
answer.reset
|
answer.reset
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Element change
|
feature -- Element change
|
||||||
|
|
||||||
set_uri (new_uri: STRING)
|
set_uri (new_uri: STRING)
|
||||||
-- set new URI
|
-- set new URI
|
||||||
require
|
require
|
||||||
valid_uri: new_uri /= Void
|
valid_uri: new_uri /= Void
|
||||||
local
|
local
|
||||||
p: INTEGER
|
p: INTEGER
|
||||||
do
|
do
|
||||||
request_uri := new_uri
|
request_uri := new_uri
|
||||||
p := new_uri.index_of ('?', 1)
|
p := new_uri.index_of ('?', 1)
|
||||||
if p > 0 then
|
if p > 0 then
|
||||||
script_name := new_uri.substring (1, p - 1)
|
script_name := new_uri.substring (1, p - 1)
|
||||||
query_string := new_uri.substring (p + 1, new_uri.count)
|
query_string := new_uri.substring (p + 1, new_uri.count)
|
||||||
else
|
else
|
||||||
script_name := new_uri.string
|
script_name := new_uri.string
|
||||||
query_string := ""
|
query_string := ""
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
set_data (new_data: STRING)
|
set_data (new_data: STRING)
|
||||||
-- set new data
|
-- set new data
|
||||||
do
|
do
|
||||||
data := new_data
|
data := new_data
|
||||||
end
|
end
|
||||||
|
|
||||||
set_headers ( a_header : HASH_TABLE [STRING, STRING] )
|
set_headers ( a_header : HASH_TABLE [STRING, STRING] )
|
||||||
do
|
do
|
||||||
headers := a_header
|
headers := a_header
|
||||||
end
|
end
|
||||||
|
|
||||||
feature {NONE} -- Implementation
|
feature {NONE} -- Implementation
|
||||||
|
|
||||||
real_filename (fn: STRING): STRING
|
real_filename (fn: STRING): STRING
|
||||||
-- Real filename from url-path `fn'
|
-- Real filename from url-path `fn'
|
||||||
--| Find a better design for this piece of code
|
--| Find a better design for this piece of code
|
||||||
--| Eventually in a spec/$ISE_PLATFORM/ specific cluster
|
--| Eventually in a spec/$ISE_PLATFORM/ specific cluster
|
||||||
do
|
do
|
||||||
if {PLATFORM}.is_windows then
|
if {PLATFORM}.is_windows then
|
||||||
create Result.make_from_string (fn)
|
create Result.make_from_string (fn)
|
||||||
Result.replace_substring_all ("/", "\")
|
Result.replace_substring_all ("/", "\")
|
||||||
if Result[Result.count] = '\' then
|
if Result[Result.count] = '\' then
|
||||||
Result.remove_tail (1)
|
Result.remove_tail (1)
|
||||||
end
|
end
|
||||||
else
|
else
|
||||||
Result := fn
|
Result := fn
|
||||||
if Result[Result.count] = '/' then
|
if Result[Result.count] = '/' then
|
||||||
Result := Result.substring (1, Result.count - 1)
|
Result := Result.substring (1, Result.count - 1)
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,147 +1,147 @@
|
|||||||
|
|
||||||
class HTTP_RESPONSE
|
class HTTP_RESPONSE
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
HTTP_CONSTANTS
|
HTTP_CONSTANTS
|
||||||
redefine
|
redefine
|
||||||
default_create
|
default_create
|
||||||
end
|
end
|
||||||
|
|
||||||
create
|
create
|
||||||
default_create
|
default_create
|
||||||
|
|
||||||
feature -- creation
|
feature -- creation
|
||||||
|
|
||||||
default_create
|
default_create
|
||||||
do
|
do
|
||||||
Precursor
|
Precursor
|
||||||
set_defaults
|
set_defaults
|
||||||
end
|
end
|
||||||
|
|
||||||
set_defaults
|
set_defaults
|
||||||
-- Set default values for the reply
|
-- Set default values for the reply
|
||||||
do
|
do
|
||||||
status_code := ok
|
status_code := ok
|
||||||
create content_length_data.make_empty
|
create content_length_data.make_empty
|
||||||
reason_phrase := ok_message
|
reason_phrase := ok_message
|
||||||
content_type_data := text_html
|
content_type_data := text_html
|
||||||
set_reply_text (Void)
|
set_reply_text (Void)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Recycle
|
feature -- Recycle
|
||||||
|
|
||||||
reset
|
reset
|
||||||
do
|
do
|
||||||
set_defaults
|
set_defaults
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- response header fields
|
feature -- response header fields
|
||||||
|
|
||||||
status_code: STRING
|
status_code: STRING
|
||||||
-- status
|
-- status
|
||||||
|
|
||||||
content_length_data : STRING
|
content_length_data : STRING
|
||||||
-- length
|
-- length
|
||||||
|
|
||||||
reason_phrase: STRING
|
reason_phrase: STRING
|
||||||
-- message, if any
|
-- message, if any
|
||||||
|
|
||||||
content_type_data: STRING
|
content_type_data: STRING
|
||||||
-- type of content in this reply (eg. text/html)
|
-- type of content in this reply (eg. text/html)
|
||||||
|
|
||||||
feature -- Element change
|
feature -- Element change
|
||||||
|
|
||||||
set_content_length (new_content_length: INTEGER)
|
set_content_length (new_content_length: INTEGER)
|
||||||
require
|
require
|
||||||
positive_or_zero: new_content_length >= 0
|
positive_or_zero: new_content_length >= 0
|
||||||
do
|
do
|
||||||
content_length_data := new_content_length.out
|
content_length_data := new_content_length.out
|
||||||
end
|
end
|
||||||
|
|
||||||
set_status_code (new_status_code: STRING)
|
set_status_code (new_status_code: STRING)
|
||||||
require
|
require
|
||||||
not_void: new_status_code /= Void
|
not_void: new_status_code /= Void
|
||||||
do
|
do
|
||||||
status_code := new_status_code
|
status_code := new_status_code
|
||||||
end
|
end
|
||||||
|
|
||||||
set_reason_phrase (new_reason_phrase: STRING)
|
set_reason_phrase (new_reason_phrase: STRING)
|
||||||
require
|
require
|
||||||
not_void: new_reason_phrase /= Void
|
not_void: new_reason_phrase /= Void
|
||||||
do
|
do
|
||||||
reason_phrase := new_reason_phrase
|
reason_phrase := new_reason_phrase
|
||||||
end
|
end
|
||||||
|
|
||||||
set_content_type (new_content_type: STRING)
|
set_content_type (new_content_type: STRING)
|
||||||
require
|
require
|
||||||
not_void: new_content_type /= Void
|
not_void: new_content_type /= Void
|
||||||
do
|
do
|
||||||
content_type_data := new_content_type
|
content_type_data := new_content_type
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Access: send reply
|
feature -- Access: send reply
|
||||||
|
|
||||||
reply_header: STRING
|
reply_header: STRING
|
||||||
-- header
|
-- header
|
||||||
do
|
do
|
||||||
Result := http_version_1_1.twin
|
Result := http_version_1_1.twin
|
||||||
Result.extend (' ')
|
Result.extend (' ')
|
||||||
Result.append (status_code)
|
Result.append (status_code)
|
||||||
Result.extend (' ')
|
Result.extend (' ')
|
||||||
Result.append (reason_phrase)
|
Result.append (reason_phrase)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
Result.append ({HTTP_SERVER_CONFIGURATION}.Server_details)
|
Result.append ({HTTP_SERVER_CONFIGURATION}.Server_details)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
Result.append (Content_type + ": ")
|
Result.append (Content_type + ": ")
|
||||||
Result.append (content_type_data)
|
Result.append (content_type_data)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
Result.append (Content_length + ": ")
|
Result.append (Content_length + ": ")
|
||||||
Result.append (content_length_data)
|
Result.append (content_length_data)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
-- TODO: could add the size of data being sent here and
|
-- TODO: could add the size of data being sent here and
|
||||||
-- then keep the connection alive
|
-- then keep the connection alive
|
||||||
end
|
end
|
||||||
|
|
||||||
reply_header_continue: STRING
|
reply_header_continue: STRING
|
||||||
-- header
|
-- header
|
||||||
do
|
do
|
||||||
Result := http_version_1_1.twin
|
Result := http_version_1_1.twin
|
||||||
Result.extend (' ')
|
Result.extend (' ')
|
||||||
Result.append (status_code)
|
Result.append (status_code)
|
||||||
Result.extend (' ')
|
Result.extend (' ')
|
||||||
Result.append (continue_message)
|
Result.append (continue_message)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
Result.append (crlf)
|
Result.append (crlf)
|
||||||
-- TODO: could add the size of data being sent here and
|
-- TODO: could add the size of data being sent here and
|
||||||
-- then keep the connection alive
|
-- then keep the connection alive
|
||||||
end
|
end
|
||||||
|
|
||||||
reply_text: STRING
|
reply_text: STRING
|
||||||
-- reply text
|
-- reply text
|
||||||
|
|
||||||
feature -- Change element: send reply
|
feature -- Change element: send reply
|
||||||
|
|
||||||
set_reply_text (new_text: detachable STRING)
|
set_reply_text (new_text: detachable STRING)
|
||||||
-- text could be Void
|
-- text could be Void
|
||||||
do
|
do
|
||||||
if new_text = Void then
|
if new_text = Void then
|
||||||
create reply_text.make_empty
|
create reply_text.make_empty
|
||||||
else
|
else
|
||||||
reply_text := new_text
|
reply_text := new_text
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
append_reply_text (more_text: STRING)
|
append_reply_text (more_text: STRING)
|
||||||
-- add more text to the reply
|
-- add more text to the reply
|
||||||
require
|
require
|
||||||
reply_text /= Void
|
reply_text /= Void
|
||||||
more_text /= Void
|
more_text /= Void
|
||||||
do
|
do
|
||||||
reply_text.append (more_text)
|
reply_text.append (more_text)
|
||||||
end
|
end
|
||||||
|
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,18 +1,18 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {SHARED_URI_CONTENTS_TYPES}."
|
description: "Summary description for {SHARED_URI_CONTENTS_TYPES}."
|
||||||
author: ""
|
author: ""
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
SHARED_URI_CONTENTS_TYPES
|
SHARED_URI_CONTENTS_TYPES
|
||||||
feature
|
feature
|
||||||
|
|
||||||
ct_table: URI_CONTENTS_TYPES
|
ct_table: URI_CONTENTS_TYPES
|
||||||
once
|
once
|
||||||
create Result.make
|
create Result.make
|
||||||
end
|
end
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,82 +1,82 @@
|
|||||||
note
|
note
|
||||||
description: "Summary description for {TCP_STREAM_SOCKET}."
|
description: "Summary description for {TCP_STREAM_SOCKET}."
|
||||||
date: "$Date$"
|
date: "$Date$"
|
||||||
revision: "$Revision$"
|
revision: "$Revision$"
|
||||||
|
|
||||||
class
|
class
|
||||||
TCP_STREAM_SOCKET
|
TCP_STREAM_SOCKET
|
||||||
|
|
||||||
inherit
|
inherit
|
||||||
NETWORK_STREAM_SOCKET
|
NETWORK_STREAM_SOCKET
|
||||||
redefine
|
redefine
|
||||||
make
|
make
|
||||||
end
|
end
|
||||||
|
|
||||||
create
|
create
|
||||||
make_server_by_address_and_port,
|
make_server_by_address_and_port,
|
||||||
make_server_by_port
|
make_server_by_port
|
||||||
|
|
||||||
create {NETWORK_STREAM_SOCKET}
|
create {NETWORK_STREAM_SOCKET}
|
||||||
make_from_descriptor_and_address
|
make_from_descriptor_and_address
|
||||||
|
|
||||||
feature {NONE} -- Initialization
|
feature {NONE} -- Initialization
|
||||||
|
|
||||||
make
|
make
|
||||||
-- Create a network stream socket.
|
-- Create a network stream socket.
|
||||||
do
|
do
|
||||||
Precursor
|
Precursor
|
||||||
set_reuse_address
|
set_reuse_address
|
||||||
end
|
end
|
||||||
|
|
||||||
make_server_by_address_and_port (an_address: INET_ADDRESS; a_port: INTEGER)
|
make_server_by_address_and_port (an_address: INET_ADDRESS; a_port: INTEGER)
|
||||||
-- Create server socket on `an_address' and `a_port'.
|
-- Create server socket on `an_address' and `a_port'.
|
||||||
require
|
require
|
||||||
valid_port: a_port >= 0
|
valid_port: a_port >= 0
|
||||||
do
|
do
|
||||||
make
|
make
|
||||||
create address.make_from_address_and_port (an_address, a_port)
|
create address.make_from_address_and_port (an_address, a_port)
|
||||||
bind
|
bind
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Basic operation
|
feature -- Basic operation
|
||||||
|
|
||||||
send_message (a_msg: STRING)
|
send_message (a_msg: STRING)
|
||||||
local
|
local
|
||||||
a_package : PACKET
|
a_package : PACKET
|
||||||
a_data : MANAGED_POINTER
|
a_data : MANAGED_POINTER
|
||||||
c_string : C_STRING
|
c_string : C_STRING
|
||||||
do
|
do
|
||||||
create c_string.make (a_msg)
|
create c_string.make (a_msg)
|
||||||
create a_data.make_from_pointer (c_string.item, a_msg.count + 1)
|
create a_data.make_from_pointer (c_string.item, a_msg.count + 1)
|
||||||
create a_package.make_from_managed_pointer (a_data)
|
create a_package.make_from_managed_pointer (a_data)
|
||||||
send (a_package, 1)
|
send (a_package, 1)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Output
|
feature -- Output
|
||||||
|
|
||||||
put_readable_string_8 (s: READABLE_STRING_8)
|
put_readable_string_8 (s: READABLE_STRING_8)
|
||||||
-- Write readable string `s' to socket.
|
-- Write readable string `s' to socket.
|
||||||
local
|
local
|
||||||
ext: C_STRING
|
ext: C_STRING
|
||||||
do
|
do
|
||||||
create ext.make (s)
|
create ext.make (s)
|
||||||
put_managed_pointer (ext.managed_data, 0, s.count)
|
put_managed_pointer (ext.managed_data, 0, s.count)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature -- Status report
|
feature -- Status report
|
||||||
|
|
||||||
try_ready_for_reading: BOOLEAN
|
try_ready_for_reading: BOOLEAN
|
||||||
-- Is data available for reading from the socket right now?
|
-- Is data available for reading from the socket right now?
|
||||||
require
|
require
|
||||||
socket_exists: exists
|
socket_exists: exists
|
||||||
local
|
local
|
||||||
retval: INTEGER
|
retval: INTEGER
|
||||||
do
|
do
|
||||||
retval := c_select_poll_with_timeout (descriptor, True, 0)
|
retval := c_select_poll_with_timeout (descriptor, True, 0)
|
||||||
Result := (retval > 0)
|
Result := (retval > 0)
|
||||||
end
|
end
|
||||||
|
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1,91 +1,91 @@
|
|||||||
class URI_CONTENTS_TYPES
|
class URI_CONTENTS_TYPES
|
||||||
|
|
||||||
create
|
create
|
||||||
|
|
||||||
make
|
make
|
||||||
|
|
||||||
|
|
||||||
feature
|
feature
|
||||||
|
|
||||||
content_types: HASH_TABLE [STRING, STRING]
|
content_types: HASH_TABLE [STRING, STRING]
|
||||||
|
|
||||||
extension (uri: STRING): STRING
|
extension (uri: STRING): STRING
|
||||||
-- extract extendion from a URI
|
-- extract extendion from a URI
|
||||||
local
|
local
|
||||||
i: INTEGER
|
i: INTEGER
|
||||||
do
|
do
|
||||||
-- going from the end find the position of the "."
|
-- going from the end find the position of the "."
|
||||||
from
|
from
|
||||||
i := uri.count
|
i := uri.count
|
||||||
until
|
until
|
||||||
i = 0 or else uri.item (i) = '.'
|
i = 0 or else uri.item (i) = '.'
|
||||||
loop
|
loop
|
||||||
i := i - 1
|
i := i - 1
|
||||||
end
|
end
|
||||||
Result := uri.substring (i+1, uri.count)
|
Result := uri.substring (i+1, uri.count)
|
||||||
end
|
end
|
||||||
|
|
||||||
feature {NONE}
|
feature {NONE}
|
||||||
|
|
||||||
make
|
make
|
||||||
do
|
do
|
||||||
create content_types.make (30)
|
create content_types.make (30)
|
||||||
content_types.put ("text/html", "html")
|
content_types.put ("text/html", "html")
|
||||||
content_types.put ("text/html", "htm")
|
content_types.put ("text/html", "htm")
|
||||||
content_types.put ("image/gif", "gif")
|
content_types.put ("image/gif", "gif")
|
||||||
content_types.put ("image/jpeg", "jpeg")
|
content_types.put ("image/jpeg", "jpeg")
|
||||||
content_types.put ("image/png", "jpg")
|
content_types.put ("image/png", "jpg")
|
||||||
content_types.put ("image/png", "png")
|
content_types.put ("image/png", "png")
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
feature -- Access: Encoding
|
feature -- Access: Encoding
|
||||||
|
|
||||||
urlencode (s: STRING): STRING
|
urlencode (s: STRING): STRING
|
||||||
-- URL encode `s'
|
-- URL encode `s'
|
||||||
do
|
do
|
||||||
Result := s.string
|
Result := s.string
|
||||||
Result.replace_substring_all ("#", "%%23")
|
Result.replace_substring_all ("#", "%%23")
|
||||||
Result.replace_substring_all (" ", "%%20")
|
Result.replace_substring_all (" ", "%%20")
|
||||||
Result.replace_substring_all ("%T", "%%09")
|
Result.replace_substring_all ("%T", "%%09")
|
||||||
Result.replace_substring_all ("%N", "%%0A")
|
Result.replace_substring_all ("%N", "%%0A")
|
||||||
Result.replace_substring_all ("/", "%%2F")
|
Result.replace_substring_all ("/", "%%2F")
|
||||||
Result.replace_substring_all ("&", "%%26")
|
Result.replace_substring_all ("&", "%%26")
|
||||||
Result.replace_substring_all ("<", "%%3C")
|
Result.replace_substring_all ("<", "%%3C")
|
||||||
Result.replace_substring_all ("=", "%%3D")
|
Result.replace_substring_all ("=", "%%3D")
|
||||||
Result.replace_substring_all (">", "%%3E")
|
Result.replace_substring_all (">", "%%3E")
|
||||||
Result.replace_substring_all ("%"", "%%22")
|
Result.replace_substring_all ("%"", "%%22")
|
||||||
Result.replace_substring_all ("%'", "%%27")
|
Result.replace_substring_all ("%'", "%%27")
|
||||||
end
|
end
|
||||||
|
|
||||||
urldecode (s: STRING): STRING
|
urldecode (s: STRING): STRING
|
||||||
-- URL decode `s'
|
-- URL decode `s'
|
||||||
do
|
do
|
||||||
Result := s.string
|
Result := s.string
|
||||||
Result.replace_substring_all ("%%23", "#")
|
Result.replace_substring_all ("%%23", "#")
|
||||||
Result.replace_substring_all ("%%20", " ")
|
Result.replace_substring_all ("%%20", " ")
|
||||||
Result.replace_substring_all ("%%09", "%T")
|
Result.replace_substring_all ("%%09", "%T")
|
||||||
Result.replace_substring_all ("%%0A", "%N")
|
Result.replace_substring_all ("%%0A", "%N")
|
||||||
Result.replace_substring_all ("%%2F", "/")
|
Result.replace_substring_all ("%%2F", "/")
|
||||||
Result.replace_substring_all ("%%26", "&")
|
Result.replace_substring_all ("%%26", "&")
|
||||||
Result.replace_substring_all ("%%3C", "<")
|
Result.replace_substring_all ("%%3C", "<")
|
||||||
Result.replace_substring_all ("%%3D", "=")
|
Result.replace_substring_all ("%%3D", "=")
|
||||||
Result.replace_substring_all ("%%3E", ">")
|
Result.replace_substring_all ("%%3E", ">")
|
||||||
Result.replace_substring_all ("%%22", "%"")
|
Result.replace_substring_all ("%%22", "%"")
|
||||||
Result.replace_substring_all ("%%27", "%'")
|
Result.replace_substring_all ("%%27", "%'")
|
||||||
end
|
end
|
||||||
|
|
||||||
stripslashes (s: STRING): STRING
|
stripslashes (s: STRING): STRING
|
||||||
do
|
do
|
||||||
Result := s.string
|
Result := s.string
|
||||||
Result.replace_substring_all ("\%"", "%"")
|
Result.replace_substring_all ("\%"", "%"")
|
||||||
Result.replace_substring_all ("\'", "'")
|
Result.replace_substring_all ("\'", "'")
|
||||||
Result.replace_substring_all ("\/", "/")
|
Result.replace_substring_all ("\/", "/")
|
||||||
Result.replace_substring_all ("\\", "\")
|
Result.replace_substring_all ("\\", "\")
|
||||||
end
|
end
|
||||||
|
|
||||||
note
|
note
|
||||||
copyright: "2011-2011, Javier Velilla and others"
|
copyright: "2011-2011, Javier Velilla and others"
|
||||||
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
license: "Eiffel Forum License v2 (see http://www.eiffel.com/licensing/forum.txt)"
|
||||||
end
|
end
|
||||||
|
|||||||
@@ -1 +0,0 @@
|
|||||||
|
|
||||||
@@ -1,38 +1,38 @@
|
|||||||
Eiffel Nino HTTPD
|
Eiffel Nino HTTPD
|
||||||
=================
|
=================
|
||||||
Eiffel Nino is and HTTPD server. It's a work in progress, so maybe it will be refactored.
|
Eiffel Nino is and HTTPD server. It's a work in progress, so maybe it will be refactored.
|
||||||
The goal of is to provide a simple web server for development (like Java, Python and Ruby provide)
|
The goal of is to provide a simple web server for development (like Java, Python and Ruby provide)
|
||||||
The code is based on Xebra and Emu Web Server.
|
The code is based on Xebra and Emu Web Server.
|
||||||
|
|
||||||
|
|
||||||
Goal
|
Goal
|
||||||
========
|
========
|
||||||
HTTPD server for development, support for HTTP 1.1.
|
HTTPD server for development, support for HTTP 1.1.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Testing
|
Testing
|
||||||
=======
|
=======
|
||||||
To test the HTTPD server, you could run the [example https://github.com/jvelilla/EiffelWebNino/tree/master/example/SimpleWebServer]
|
To test the HTTPD server, you could run the [example https://github.com/jvelilla/EiffelWebNino/tree/master/example/SimpleWebServer]
|
||||||
The server work fine in Windows and Linux.
|
The server work fine in Windows and Linux.
|
||||||
|
|
||||||
Run the server and point your browser to one of the following URIs
|
Run the server and point your browser to one of the following URIs
|
||||||
|
|
||||||
1) http://localhost:9000/post/index.html
|
1) http://localhost:9000/post/index.html
|
||||||
2) http://localhost:9000/demo1/template.html
|
2) http://localhost:9000/demo1/template.html
|
||||||
3) http://localhost:9000/demo2/demo.html
|
3) http://localhost:9000/demo2/demo.html
|
||||||
4) http://localhost:9000/example/html/index.html
|
4) http://localhost:9000/example/html/index.html
|
||||||
5) http://localhost:9000/html/simple.html
|
5) http://localhost:9000/html/simple.html
|
||||||
6) http://localhost:9000/html/images.html
|
6) http://localhost:9000/html/images.html
|
||||||
7) http://localhost:9000/html/images.html
|
7) http://localhost:9000/html/images.html
|
||||||
8) http://localhost:9000/html5/dataset.html
|
8) http://localhost:9000/html5/dataset.html
|
||||||
|
|
||||||
Known Issues
|
Known Issues
|
||||||
============
|
============
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user