SlideShare une entreprise Scribd logo
1  sur  24
Télécharger pour lire hors ligne
Page 1DMXzone e-Magazine December 2008
e-Magazine
e-Magazine
Page 2DMXzone e-Magazine December 2008 Colofon & Introduction
Publisher
DMXzone is a division of
Dynamic Zones International B.V.
Mail address:
PO Box 545
7500 AM Enschede
The Netherlands
Visiting address:
Hengelosestraat 705
7521 PA Enschede
The Netherlands
Tel:	 +31 - 53 - 483 63 14
Fax:	 +31 - 53 - 433 74 15
info@dynamiczones.com
www.dynamiczones.com
All rights reserved.
Copyright © 2008
Dynamic Zones International BV
Unless otherwise noted, all of the writing in DMXzone Magazine is the copyrighted property of Dynamic Zones International BV. This copyrighted material includes all writing by staff, and some of
the artwork, drawings and logos. You may print out any articles and tutorials for your personal use only. Materials may not be reproduced on another web site, book, or publication without express
written permission. Any reproduction or editing without the explicit written permission of DMXzone Magazine is expressively prohibited. Certain names, logos, phrases, and artwork on these pages
may constitute trademarks of Dynamic Zones International BV or its sponsors. Reproduction in whole or in part is strictly prohibited without written permission of Dynamic Zones International BV.
Dynamic Zones International BV also cannot guarantee that all content and material appearing in the DMXzone Magazine is not infringing on any registered or non-registered copyrights. DMXzone
Magazine is published monthly (12 times a year) by Dynamic Zones International BV.
Interfaces & Widgets
Improve your graphical user interfaces with cool controls
using jQuery, Ajax and ASP.NET. Get inspired by Hollywood
based photographer Brian McCarty who has a passion for
toys and photography to the point of hypothermia.
Dan Wellman will teach you how to code a cool pop-up
emailer; the visitor enters their details, a friend’s email address
and a short message into the form on the popup, and
when they’re done the widget asynchronously passes
the data, as well as the URL of the current page, to the
server for conversion to mail format before sending.
Kevin will learn you how to use the Accordion Ajax control to display large
amounts of data on a single page by allowing sections of the content to be
expanded and collapsed. After that he shows you how to create a Collapsible
Panel control that allows you to independently expand/collapse different
sections of the page without affecting the other sections.
Learn how you can add a Panel control to a web form and have its contents
always visible regardless of the scroll position of the page. This technique is used
all over the internet and can be quite tricky to implement, but you can learn
how in this tutorial without writing any client-side JavaScript whatsoever.
CEO
George Petrov
magazine@dmxzone.com
Chief Editor
Frank Beverdam
frank@dmxzone.com
Technical Editor
Patrick Woldberg
patrick@dmxzone.com
Illustrator
Simon Saado
Interview
Brian McCarty
Tania Antonova
DTP
Simon Saado
Advertising
George Petrov
advertising@dmxzone.com
Subscriptions
Yearly subscription: € 24.99
2 year subscription: € 39.99
subscriptions@dmxzone.com
Page 3DMXzone e-Magazine December 2008 List of Contents
e-Magazine
18
39 40
54 12
31
41
24
Agenda
DMXzone brings you
the latest events, take
a look to see what is
going on in the world
of web development
and design.
Coding a jQuery Plugin
Part 2
In this part of the tutorial
we’re going to continue
adding the functionality
that will enable our
widget to work in the
way that we want it to.
Creating Accordion
Collapsible Panels in
ASP.NET
In this video tutorial you'll
learn how to use the
Accordion Ajax
control to display large
amounts of data on a
single page
Creating Independent
Collapsible Panels with
Ajax in ASP.NET
During this tutorial you
will learn how you can
create expandable/
collapsible sections of
content on a page.
Creating an Always
Visible Container in ASP.
NET
During this tutorial you'll
learn how you can add
a Panel control to a web
form and have its
contents always visible
regardless of the scroll
position of the page.
Coding a jQuery Plugin
Part 3
Dan shows you how
to add the functions
for showing the popup
when the link element
is attached. He also
shows you how to add
the code for the AJAX
success handler.
Interview: Brian McCarty
Hollywood based
photographer Brian
McCarty has passion for
toys and
photography to the
point of hypothermia..
News
We bring you the latest
industry news, so don't
hestitate and take a
peek if you want to
stay tuned with latest
developments..
Coding a jQuery Plugin
Part 1
Over the course of this
tutorial we’ll be coding
our very own jQuery
plugin
Event	 Date	 Place
Page 4DMXzone e-Magazine December 2008 Agenda
e-Magazine
D-65Workshop December 12- 15 Austin,TX
The D-65 workshops teach bulletproof techniques using Adobe Photoshop and new Photoshop Lightroom 2.0 to increase workflow productivity and save time.
Web-Blast December 5 Sydney, Australia
Web-blast is a huge end-of-year party for Sydney's web community - bringing together web designers,web project managers,interface designers.
OZCHI 2008 December 8-12 Cairns, Australia
OZCHI is Australia and New Zealand's leading forum for work in all areas of human-computer interaction.
Web DesignWorld Boston December 8-10 Boston, Massachusetts, U.S.A.
Web DesignWorld Boston is an incredible opportunity to gain insight and interact with some of the hottest designers / developers in the web industry.
Page 5DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
SearchWiki: Your Own
Search.
Google launched SearchWiki, a
way to customize search by re-
ranking, deleting, adding, and
commenting on search results. With
just a single click you can move the
results you like to the top or add a
new site. You can also write notes
attached to a particular site and
remove results that you don't feel
belong.
These modifications will be shown
to you every time you do the same
search in the future. SearchWiki is
available to signed-in Google us-
ers. They store the changes in your
Google Account. If you are won-
dering if you are signed in, you can
always check by noting if your user-
name appears in the upper right-
hand side of the page.
The changes you make only affect
your own searches. But Search-
Wiki also is a great way to share
your insights with other searchers.
This new feature is an example of
how search is becoming increas-
ingly dynamic, giving people tools
that make search even more useful
to them in their daily lives. Google
has been testing bits and pieces of
SearchWiki for some time through
live experiments, and they incorpo-
rated much of our learnings into this
release.
Read it at the external site...
Mac OS X Snow Leopard
10.6 Soon?
Last week at Large Installation Sys-
tem Administration ference(Lisa'08)
Apple's director of Engineering of
ix Technologies Jordan Hubbard
anounced the date for Apple's
Mac OS X 10.6 - 1st Quarter 2009.
When Apple first previewed Snow
Leopard at the Worldwide Devel-
opers Conference 2008, they simply
stated that Snow Leopard would
ship "in about a year" from the an-
nouncement. A Q1 release would
deliver it earlier than most had ex-
pected and makes it conceivable
that we could see a demo or an-
nouncement at Macworld San
Francisco 2009.
Apple has said that they would be
focusing on both quality and per-
formance in Snow Leopard. In par-
ticular, Apple has made it clear that
there will be efforts to improve sup-
port for multi-core processors and
GPU processing. These improve-
ments will help developers more ef-
ficiently use these capabilities that
already ship in Macs.
Read it at the external site...
YouTube Tests Out High
Quality, Stereo Surround
Videos
This week YouTube has started test-
ing HD quality videos on a smatter-
ing of its content. The new format
could be a big move for YouTube,
as the video size is over 80mb,
which means that they are prob-
ably the same H.264 encoded mp4
files available in the iTunes store.
Page 6DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
The new formats have been avail-
able on a few videos for a few
months now, and a small hack can
upgrade any video taped at a high
enough quality. YouTube confirms
this is part of their efforts to test out
different video formats.
The new format seems like real HD
720p video and looks clean and
professional in the widescreen for-
mat. It is possible to make YouTube's
high quality video the default on the
site, but formerly it was only possible
to watch at a 480x360 resolution.
Japanese website Google Mania
claims that there is also an option to
download video as an MP4, which
would be big news as YouTube users
have long desired that option, but
the download link does not seem to
appear on any of the U.S. versions.
While these videos will result in slow-
er loading and require powerful PCs
for smooth playback, HD quality
videos are a step in the right direc-
tion for YouTube. Now if they can
just work on getting a larger inven-
tory of high quality content people
want to watch on there, their ad
model will be in business.
Read it at the external site...
Lively No More
In July Google launched Lively in
Google Labs because they want-
ed users to be able to interact with
their friends and express themselves
online in new ways. Google has al-
ways been supportive of this kind
of experimentation because they
believe it's the best way to create
groundbraking products that make
a difference to people's lives. But
they've also always accepted that
when you take these kinds ot risks
not every bet is going to pay off.
The new formats have been avail-
able on a few videos for a few
months now, and a small hack can
upgrade any video taped at a high
enough quality. YouTube confirms
this is part of their efforts to test out
different video formats.
The new format seems like real HD
720p video and looks clean and
professional in the widescreen for-
mat. It is possible to make YouTube's
high quality video the default on the
site, but formerly it was only possible
to watch at a 480x360 resolution.
Japanese website Google Mania
claims that there is also an option to
download video as an MP4, which
would be big news as YouTube users
have long desired that option, but
the download link does not seem to
appear on any of the U.S. versions.
While these videos will result in slow-
er loading and require powerful PCs
for smooth playback, HD quality
videos are a step in the right direc-
tion for YouTube. Now if they can
just work on getting a larger inven-
tory of high quality content people
want to watch on there, their ad
model will be in business.
Read it at the external site...
Page 7DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
IE8: What's After Beta 2?
Since the release of Beta 2,the data
from real people about the product
has been absorbed. The IE team has
combed through instrumentation of
over 20 million IE sessions and hun-
dredsofhoursofusabilitylabsessions.
Together with IE MVPs, they have
scrutinized thousands of threads
from user forums and examined
the issues that people are raising.
IE teаm will release one more public
update of IE8 in the first quarter of
2009, and then follow that up with
the final release. Their next pub-
lic release of IE indicates the end
of the beta period. They want the
technical community of people
and organizations interested in web
browsers to take this update as a
strong signal that IE8 is effectively
complete and done. They should
expect the final product to behave
as this update does. They want
them to test their sites and services
with IE8, make any changes they
feel are necessary for the best pos-
sible customer experience using IE8,
and report any critical issues (e.g., is-
sues impacting robustness, security,
backwards compatibility, or com-
pleteness with respect to planned
standards work). The plan is to de-
liver the final product after listening
for feedback about critical issues.
They will be very selective about
what changes they make between
the next update and final release
act on the most critical issues.
Read it at the external site...
FOIA Docs Show Feds Can
Lojack Mobiles Without Tel-
co Help
Courts in recent years have been
raising the evidentiary bar law en-
forcement agents must meet in or-
der to obtain historical cell phone
records that reveal information
about a target's location. But doc-
uments obtained by civil liberties
groups under a Freedom of Infor-
mation Act request suggest that
"triggerfish" technology can be used
to pinpoint cell phones without in-
volving cell phone providers at all.
Triggerfish, also known as cell-site
simulators or digital analyzers, are
nothing new: the technology was
used in the 1990s to hunt down re-
nowned hacker Kevin Mitnick. By
posingasacelltower,triggerfishtrick
nearby cell phones into transmitting
theirserialnumbers,phonenumbers,
and other data to law enforcement.
Most previous descriptions of the
technology, however, suggested
that because of range limitations,
triggerfish were only useful for zero-
ing in on a phone's precise location
once cooperative cell providers
had given a general location.
Page 8DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
In a post on the progressive blog
Daily Kos, ACLU spokesperson
Rachel Myers drew attention to
language in several of those docu-
ments implying that triggerfish have
broader application than previously
believed.
Тhe Justice Department's electronic
surveillance manual explicitly sug-
gests that triggerfish may be used
to avoid restrictions in statutes like
CALEA that bar the use of pen reg-
ister or trap-and-trace devices—
which allow tracking of incoming
and outgoing calls from a phone
subject to much less stringent evi-
dentiary standards—to gather loca-
tion data.
By its very terms, according to the
manual, this prohibition applies
only to information collected by
a provider and not to information
collected directly by law enforce-
ment authorities.Thus, CALEA does
not bar the use of pen/trap orders
to authorize the use of cell phone
tracking devices used to locate tar-
geted cell phones.
Read it at the external site...
Microsoft Likes Search Deal
With Yahoo
Microsoft is interested in resuming
talks on a Web search partnership
with Yahoo. Yahoo shares fell 19
percent on the remarks, after gain-
ing this week on renewed investor
hopes that Microsoft may refresh its
bid for the Internet company after
Yahoo Chief Executive Jerry Yang
announced that he would step
down.
Microsoft withdrew its $47.5 billion
buyout offer for Yahoo in May after
Yang and his board rejected the
bid as too low. The software com-
pany then offered to buy Yahoo's
search business, but Yahoo decid-
ed instead to sign a search advertis-
ing deal with Google Inc
The Google deal has since fallen
apart, after opposition from U.S.
antitrust regulators who were con-
cerned about an alliance between
the Web's two biggest search com-
panies.
Microsoft has said that it was still in-
terested in pursuing a search deal
with Yahoo. There's no active dis-
cussion on that front but Microsoft
would be very open to it.
Ballmer said that Microsoft is look-
ing for areas to cut costs, including
hiring, which "points to much, much
slower growth...in head count for
the remainder of this financial year
and that he suspects into next finan-
cial year.However, investment in
research and development would
continue.
Read it at the external site...
Which Browser is King?
The best way to find out which
browser suits you the most is simply
to run only one test for a brows-
er: whether it runs fast enough. A
slow-loading, incompatible brows-
er is one thing, but the real issue is
whether a browser loads fast for the
sites you frequently visit.
Page 9DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
V8 Benchmark Suite
This test measures JavaScript speed
for rich Web applications. Obviously,
Chrome includes the V8 code and
the other browsers do not. They test-
ed the version of Firefox (called Mine-
field) that does include the V8 code
and listed those results below the "of-
ficial" findings.
The V8 Benchmark Suite loads JavaS-
cript code to test OS kernel, encryp-
tion and decryption, raytracing, and
other tests to measure the speed of a
rich JavaScript application. Winner—
Google Chrome.
Browser Extensions
SVG and Canvas extensions are used
for more complex XML renderings
where data is pulled from an external
source. The test loads vector images
into the browser window. IE7 does not
support the SVG and Canvas test,
and Microsoft advised ExtremeTech
against using the IE8 beta, which is still
early.
The differences don't seem so mas-
sive, though IE7's inability to run these
extensions is problematic. IE8 will fix
that compatibility issue, but Micro-
soft's code isn't yet optimized.
Acid 3 Test
Acid3 is a compatibility test that meas-
ures the default settings in a browser,
plays an animation, and compares
the resulting image to a reference
image. There's a final compatibility
score, and a pass/fail system—the
browser must score 100 out of 100 to
pass, and none of the browser we
used passed. Once again, IE7 did not
even run the test correctly and pro-
duced no final score. Winner - Opera.
Adobe Flash
Flash has become increasingly com-
mon, and the rendering engine for
each browser is the same—once you
have Flash installed, it is used for each
browser. The crab test adds animat-
ed crabs on the screen in succession
until the animation rate goes below
25 frames per second.
Firefox trumped all of the other brows-
ers, animating ten additional crabs on
the screen—well ahead of the sec-
ond place finishers. We also tested IE8
to see if Microsoft had improved Flash
rendering—apparently not. Winner -
Mozilla Firefox.
Read it at the external site...
Microsoft is Back on Track
with Vista SP2
From the other side of the world
comes a report that Windows Vista
Service Pack 2 will be released to
manufacturing in April 2009, roughly
a year after SP1. The Malaysian web-
site TechARP has a pretty good track
record with this sort of prediction,
and my sources tell me that schedule
sounds about right.
If Vista SP2 does make its official ap-
pearance in April, it will mark a return
to normal development and release
cycles for Microsoft, which lost its way
badly with Windows XP.
As measured by service pack releas-
es, the XP era was a distinct anomaly
for Microsoft. Over the past 12 years,
Microsoft has delivered 14 Windows
service packs. The gap between SP1
and SP2 was a record 697 days, near-
ly two full years. But that pales in com-
parison to the gap between SP2 and
SP3, which was nearly four years. If we
throw out SP3 and also disregard NT4
SP2, which appeared a mere 59 days
after its predecessor, we discover
that the average gap between serv-
ice-pack releases is around 300 days,
or just under a year apart.
Page 10DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
If Vista SP2 arrives in mid-April 2009, it
will be 355 days since its predecessor,
or very close to the historical averag-
es.
Beginning with Windows Vista, Micro-
soft is using Windows Update to de-
liver reliability, compatibility, and per-
formance fixes in addition to security
patches. For Windows users, this is a
new development. Windows XP us-
ers never got this type of update, but
Vista users were treated to a steady
stream of them.
Read it at the external site...
Sun Warns of Bugs as it Re-
leases MySQL 5.1
Sun has released version 5.1 of the
open-source MySQL database soft-
ware, but the software's founder si-
multaneously warned of a number of
bugs present in the new features that
are still to be fixed.
The founder of MySQL, Michael 'Mon-
ty' Widenius, stated in a blog post on
Saturday that most of the issues iden-
tified were serious or crashing bugs.
There are also a number of older,
known bugs that are still present in
this release.
The new features introduced have
been ranked as 'beta' quality. There
are a number of issues associated
with the partitioning feature.
Row-based replication has not been
enabled by default, because of a
number of problems. Users are ad-
vised to test the latest MySQL version
before deploying it to production sys-
tems.
Read it at the external site...
Lunacore - the multi-engine
browser
Lunascape includes Trident (Internet
Explorer), Gecko (Firefox) and WebKit
(Safari & Chrome) rendering engines
allowing the user to switch on-the-fly
between them.
The Janapeese company claims that
their browser is the best at handling
JavaScript - according to SunSpide
JavaScript benchmarking tool, the
new browser demonstrates twice as
better results in respect to FireFox3
and even has superiority over Goog-
le Chrome, considered for the fastest
browser at the moment.
Lunascape automatically switches
between the rendering engines - all
the user needs to do is to indicate the
rendering method once per site.
The current release of Lunascape is
still in Alpha, and available just for Mi-
crosoft Windows. There is still no offi-
cial date for the retail release.
Read it at the external site...
Move over, Ajax. Here
comes Microsoft's "Kojax"
Kojax is a mobile development plat-
form, that will allow Microsoft- and
third-party-developed — applets run
in an Ajax-like way, using a combina-
tion of Visual Studio tools and JavaS-
cript, on Java-based mobile phones.
Page 11DMXzone e-Magazine December 2008 News
e-Magazine
NEWS
What kinds of mobile applets are we
talking about here? Something like a
virtual wallet for online payments, a
group messaging service and photo-
sharing app — things that build on top
of Windows Live for Mobile services.
Some of these Kojax-based applets
will ad-funded; others will likely be
transaction- and subscription-based.
Another interesting part of the Kojax
tips I’ve received: Microsoft allegedly
is aiming its Kojax applet plans prima-
rily at users in emerging markets.
The Kojax work may or may not be re-
lated to a recent Unlimited Potential
initiative known as “Mobile First.” Mo-
bile First is all about users whose first
Microsoft-related experience tends
to be in the mobile-phone, rather
than the PC, realm.
Read it at the external site...
Window7 taskbar: Most Inter-
esting Part of the New OS?
The most interesting feature about
the new OS is the taskbar. But it's also
the most cloaked in mystery, as it was
not part of the pre-beta Windows 7
software handed out to attendees at
Microsoft's PDC (Professional Devel-
opers Conference) last month.
Microsoft does seem to be trying to
break new ground with the look, feel,
and functionality of the Windows 7
taskbar.
Unified quick launch and taskband
Microsoft has merged Quick Launch
and the taskband into a big, happy
launching and switching family. But-
tons in the Quick Launch bar that
open a program turn into a window
switcher when launched.
This may not be a new concept, but
Microsoft says that the difference
with Windows 7 is that no matter
how many, say, IE browsers you have
open, and whether or not they are
minimized or maximized, there will
only be a single representation of IE
on the taskbar. This is the default set-
ting and you have the freedom to
have as many buttons as you want.
Interactive, grouped tumbnails
The Windows Vista taskbar shows cor-
responding thumbnails when you
mouse over a taskbar button, but in
Windows 7, these thumbnails are click-
able, allowing you to open, close, or
switch between windows right from
the thumbnails. Also, each thumbnail
looks like a mini version of the window
it is representing, be it a Web browser,
Word document, or PowerPoint ap-
plication.
Aero peek
The functionality of Vista's Aero graph-
ical interface has been extended.
The "Aero Peek" feature in Windows
7 should come in handy when your
thumbnails are e-mails or Word docu-
ments with text and details that are
too small to recognize. Why squint if
you don't have to?
Aero Peek displays the actual, full-size
window on the desktop of the thumb-
nail you are hovering over. Not only
that, but all other windows open on
the desktop become transparent-or
turn into "glass sheets" to use Micro-
soft lingo -- so you can focus quickly
on the window you want.
Jump list
The advantage of Jump Lists, is that
you don't need to start a program
to quickly launch a file or access a
task; you just right-click on a button.
The files in the Jump List don't take up
space on the taskbar; they are auto-
matically organized by their respec-
tive program in a list.
Read it at the external site...
Page 12DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 1
e-Magazine
Over the course of this tutorial we’ll be coding our very own jQuery plugin that will sit on top of the excellent
foundation provided by jQuery and function like a jQuery UI widget. We’ll be making the most of the
object-oriented features of both jQuery and of JavaScript itself and getting down to some quality coding using the lat-
est best-practice techniques.
Page 13DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 1
e-Magazine
The widget we’ll be creating is a pop-up emailer; the
visitor enters their details, a friend’s email address and
a short message into the form on the popup, and
when they’re done the widget asynchronously passes
the data, as well as the URL of the current page, to the
server for conversion to mail format before sending.
The plugin itself consists of just the front end; a backend
application will also be required, which we can code
nearer the end of the tutorial. The following screenshot
shows what we’ll be constructing:
jQuery provides an object-oriented construct that
makes coding a plugin particularly easy, as you’ll see.
As well as looking at the code needed to produce
this simple widget, we’ll also be focusing on the
programming style and general recommendations that
we should meet when writing plugins specifically for
jQuery.
Getting Started
First we need to setup an appropriate environment the
various files that our widget depends upon can work in.
Create a new folder somewhere convenient and call
it jMailer; within this folder create two additional folders
and call them img and jquery.
Download a copy of the latest stable release of the
jQuery library (if you don’t have one already) and
place it in the jquery folder. The JavaScript file that
makes up jQuery has the version number appended to
the end of the filename; remove the version number,
leaving the file called simply jquery.js. There should be
a code download with this tutorial, download that too
and unpack the images into the img folder.
Now we’re ready to go, we’ll start off with the
JavaScript, which should go into its own file. A specific
naming convention should be used for a jQuery plugin;
the main JavaScript file should be called jquery.
pluginName.js.
A good practice we can set up here before we
add any code is to think about how we are going to
indent our code. It’s a small thing I know, but to make
more code readable it should always be indented.
Coding a jQuery Plugin Part 1
Dan Wellman
Page 18DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 2
e-Magazine
Welcome back to part 2 of the jQuery plugin creation tutorial; in
part one we created our protected-properties and configurable
properties, as well as the object that will make up our plugin. We added
the method that developers will call to create an instance of our widget.
Page 19DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 2
e-Magazine
In this part of the tutorial we’re going to continue
adding the functionality that will enable our widget to
work in the way that we want it to. All of the functions
left to add are internal methods shielded from the
developer that are required internally by the plugin.
Let’s make a start.
Adding More Functionality
When we added our method, we saw that it called
two functions (well, it called one function, but the click
handler we added within it also called a function).
The first of these was the createMailer function which
will do the bulk of the work. We can add the code for
this next. After our main method (the one that uses the
fn.extend method) add the following code:
This is rather a long function so we’ll look at it step-by-
step; first we need to overcome an IE6 bug if IE6 is the
browser is use. We check our ie6 property to see if it is
set to true and if so we add some styling to the <body>
of the page. If we don’t do this, the overlay will not
cover the entire page if and when it appears. This is
done using the trusty JavaScript ternary conditional
construct.
Next we create the containing element for our mailer
form; this is done with a freshly baked <div> courtesy
of jQuery. As the developer is free to set a different id
for the instance of the widget, we can’t refer to the
mailer using a specific id. Our function accepts the
configuration object as an argument so we simply get
the id property from this and add it as the id attribute
of the new <div>. We also set some CSS properties of
the new <div>, including display:”none” because we
don’t want the form displayed straight away. Once this
has been done we append it to the end of the <body>
ready to appear when necessary.
Next we create a <fieldset> element to hold the various
fields within our form (it’s not truly a form because
there’s no form element, but we’ll be submitting it via
AJAX anyway so it’s not strictly necessary). Again we
set an id and some CSS properties before appending
it to the container <div> we created a moment ago,
again referring to the container using the config.id
property.
We can now move on to create the elements of the
form, we’ll need some label-like elements and some
input fields to capture the visitor’s data. The most
Coding a jQuery Plugin Part 2
Dan Wellman
function createMailer(config, url) {
		
//normalize body if ie6
(ie6 == true) ? $(“body”).css({padding:”0”,
margin:”0”}).width(“100%”).height(“100%”) : null ;
	
//create mailer div
$(“<div>“).attr(“id”, config.id).addClass(“mailerDiv”).
css({backgroundColor:”#cccccc”, padding:”10px
5px 30px 0”, display:”none”, position:”absolute”,
zIndex:”99999”, width:”300px”}).appendTo($(“body”));
			
//create mailer form
$(“<fieldset>“).attr({id:”mailerForm”}).
css({border:0,padding:0}).appendTo(“#” + config.id);
Page 24DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 3
e-Magazine
Page 25DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 3
e-Magazine
Coding a jQuery Plugin Part 3
We now reached part 3 of the jQuery plugin authoring
tutorial; we’ve now added most of the functionality for
our plugin, but there are still a number of loose ends
that need to be tied up; namely, we still need to add
the functions for showing the popup when the link
element is attached, as well as add the code for the
AJAX success handler.
The show function receives the same configuration
object as our previous functions did, and the first thing
we do is check whether modality is enabled. If it is
we create an overlay element that will sit behind the
popup, but in front of the rest of the page content.
Instead of relying solely on the z-index stacking order,
we insert the overlay directly before the already
created widget, which prevents IE from tripping over its
own feet and getting confused about which element
should appear on top.
In part 2 of this tutorial I mentioned that we’d be
creating an iframe shim when the browser in use is IE6
(or when the shim property is set to true); the next part
of code checks the shim property and creates the
new <iframe> element if it is set to true. There are some
required attributes we need to set, as well as some
CSS styles before the element is inserted into the DOM
directly before the overlay.
Coding a jQuery Plugin Part 3
Dan Wellman
function show(config) {
//create modal if set to true
(config.modal == true) ? $(“<div>“).attr(“id”,
“overlay”).css({
opacity:0.7, backgroundColor:”#000000”,
zIndex:99990, height:”100%”, width:”100%”,
position:”absolute”, top:0, left:0
}).insertBefore(“#” + config.id) : null ;
//create shim if enabled
(config.shim == true) ? $(“<iframe>“).attr({
src:”“, frameBorder:”0”, scrolling:”no”, id:”shim”
}).css({
display:”block”, zIndex:99989, opacity:0,
height:”100%”, width:”100%”,
position:”absolute”, top:0, left:0
}).insertBefore(“#overlay”) : null ;
		
//set mailer position
var left = vDim.width / 2 - $(“#” + config.id).width() /
2;
var top = vDim.height / 2 - $(“#” + config.id).height() /
2;
//remove error message and styling if present
(!$(“.errorMsg”)) ? null : $(“.errorMsg”).remove();
$(“#” + config.id + “ input”).each(function(){
$(this).css({border:”1px solid #abadb3”});
$(this).prev().css({color:”#000000”});
});
		
//show mailer
$(“#” + config.id).css({left:left, top:top}).show(“slow”);
	
};
Page 31DMXzone e-Magazine December 2008 Interview: Brian McCarty
e-Magazine
Hollywood based photographer Brian
McCarty has a passion for toys and
photography to the point of hypothermia.
Page 32DMXzone e-Magazine December 2008 Interview: Brian McCarty
e-Magazine
Where does your passion for toys come from?
I’ve always had a passion for toys. About the time I was
supposed to grow up and stop playing with toys, they
became subjects of my early, fumbling experiments with
photography. They’ve always held magic for me. They are
organic icons, totems of who we are as a culture.
Toys help children learn to be adults and remind adults of
how to think like a child. What inspires you?
A better question might be what doesn’t inspire me. The things I absorb in
everyday life are reflected and refracted through my work. From places
to people, from books to movies, it all strikes a chord. Music is of particular
importance to me. I’ll often focus on a particular piece while shooting or
working in my sketchbook.
As for what artists inspire me the most, I admire the work of a number
of documentary photographers, like Robert Frank, Helen Levitt, Bruce
Davidson, and Eugene Richards. They capture and highlight reality from
such distinct perspectives, finding beauty in the mundane and sometimes
grotesque.
"Toys help children learn to be adults and
remind adults of how to think like a child"
Page 33DMXzone e-Magazine December 2008 Interview: Brian McCarty
e-Magazine
Page 39DMXzone e-Magazine December 2008 Creating Accordion Collapsible Panels in ASP.NET
e-Magazine
In this video tutorial you'll learn how
to use the	 Accordion Ajax control to
display large amounts of data on a
single page by allowing sections of the
content to be expanded/collapsed.
Page 40DMXzone e-Magazine December 2008 Creating Independent Collapsible Panels with Ajax in ASP.NET
e-Magazine
Welcome to Creating
Independent Collapsible
Panels with Ajax in ASP.NET
During this tutorial you will
learn how you can create
expandable/collapsible sections of
content on a page. Unlike the
Accordion control which only
allows a single section of content
to be displayed, the Collapsible
Panel control allows you to
independently expand/collapse
different sections of the page
without affecting the other sections
Page 41DMXzone e-Magazine December 2008 Creating an Always Visible Container in ASP.NET
e-Magazine
During this tutorial you'll
learn how you can add a
Panel control to a web form and
have its contents always visible
regardless of the scroll position
of the page. This technique is
used all over the internet and can
be quite tricky to implement, but
you can learn how in this
tutorial without writing any
client-side javascript
whatsoever.
Page 42DMXzone e-Magazine November 2008 Next Edition
e-Magazine

Contenu connexe

Tendances

Group3 storyboardscript
Group3 storyboardscriptGroup3 storyboardscript
Group3 storyboardscript
gawnelis
 
Ready the Technology
Ready the TechnologyReady the Technology
Ready the Technology
jhucte
 
James Nix Evaluation Question a2 media.
James Nix Evaluation Question a2 media.James Nix Evaluation Question a2 media.
James Nix Evaluation Question a2 media.
Nixey1234
 

Tendances (17)

SharePoint Re-branding The VisualStudio Way Part One SandBox Solution
SharePoint Re-branding The VisualStudio Way Part One SandBox SolutionSharePoint Re-branding The VisualStudio Way Part One SandBox Solution
SharePoint Re-branding The VisualStudio Way Part One SandBox Solution
 
Taming Complexity: Drupal 8 UX
Taming Complexity: Drupal 8 UXTaming Complexity: Drupal 8 UX
Taming Complexity: Drupal 8 UX
 
Video wave review
Video wave reviewVideo wave review
Video wave review
 
Girl Scouts Website Designer Badge Seminar - Presentation Slides
Girl Scouts Website Designer Badge Seminar - Presentation SlidesGirl Scouts Website Designer Badge Seminar - Presentation Slides
Girl Scouts Website Designer Badge Seminar - Presentation Slides
 
Group3 storyboardscript
Group3 storyboardscriptGroup3 storyboardscript
Group3 storyboardscript
 
Load webcam images with google’s blogger
Load webcam images with google’s bloggerLoad webcam images with google’s blogger
Load webcam images with google’s blogger
 
Question 6
Question 6Question 6
Question 6
 
Slide rocket COL 270
Slide rocket COL 270Slide rocket COL 270
Slide rocket COL 270
 
Evaluation Question 4
Evaluation Question 4Evaluation Question 4
Evaluation Question 4
 
Evaluation Question 4
Evaluation Question 4Evaluation Question 4
Evaluation Question 4
 
Taskade review
Taskade reviewTaskade review
Taskade review
 
Ready the Technology
Ready the TechnologyReady the Technology
Ready the Technology
 
new media technologies
new media technologiesnew media technologies
new media technologies
 
James Nix Evaluation Question a2 media.
James Nix Evaluation Question a2 media.James Nix Evaluation Question a2 media.
James Nix Evaluation Question a2 media.
 
Snipping tool review
Snipping tool reviewSnipping tool review
Snipping tool review
 
Snipping tool review
Snipping tool reviewSnipping tool review
Snipping tool review
 
G-Suite for Education - Methods and Modes
G-Suite for Education - Methods and ModesG-Suite for Education - Methods and Modes
G-Suite for Education - Methods and Modes
 

Similaire à E-magazineDecember_sample

Microsoft Webday 2008 - Silverlight Experiences
Microsoft Webday 2008 - Silverlight ExperiencesMicrosoft Webday 2008 - Silverlight Experiences
Microsoft Webday 2008 - Silverlight Experiences
Nicklas Andersson
 
The Road To Openness.Odt
The Road To Openness.OdtThe Road To Openness.Odt
The Road To Openness.Odt
Kaniska Mandal
 

Similaire à E-magazineDecember_sample (20)

Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5
 
HTML5 Up and Running
HTML5 Up and RunningHTML5 Up and Running
HTML5 Up and Running
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with libraries
 
Fuel for a great web experience
Fuel for a great web experienceFuel for a great web experience
Fuel for a great web experience
 
youtube.pdf
youtube.pdfyoutube.pdf
youtube.pdf
 
Internship Presentation 1 Web Developer
Internship Presentation 1 Web DeveloperInternship Presentation 1 Web Developer
Internship Presentation 1 Web Developer
 
Microsoft Webday 2008 - Silverlight Experiences
Microsoft Webday 2008 - Silverlight ExperiencesMicrosoft Webday 2008 - Silverlight Experiences
Microsoft Webday 2008 - Silverlight Experiences
 
The Road To Openness.Odt
The Road To Openness.OdtThe Road To Openness.Odt
The Road To Openness.Odt
 
presentaion.pptx
presentaion.pptxpresentaion.pptx
presentaion.pptx
 
235042632 super-shop-ee
235042632 super-shop-ee235042632 super-shop-ee
235042632 super-shop-ee
 
Public-i User Group Presentation (June 14)
Public-i User Group Presentation (June 14)Public-i User Group Presentation (June 14)
Public-i User Group Presentation (June 14)
 
2020 Top Web Development Trends
2020 Top Web Development Trends2020 Top Web Development Trends
2020 Top Web Development Trends
 
HTML5 for SEO and accessibility in 2016
HTML5 for SEO and accessibility in 2016HTML5 for SEO and accessibility in 2016
HTML5 for SEO and accessibility in 2016
 
IRJET- Creating Website as a Service using Web Components
IRJET-  	  Creating Website as a Service using Web ComponentsIRJET-  	  Creating Website as a Service using Web Components
IRJET- Creating Website as a Service using Web Components
 
Swf search final
Swf search finalSwf search final
Swf search final
 
Using Clojure, NoSQL Databases and Functional-Style JavaScript to Write Gext-...
Using Clojure, NoSQL Databases and Functional-Style JavaScript to Write Gext-...Using Clojure, NoSQL Databases and Functional-Style JavaScript to Write Gext-...
Using Clojure, NoSQL Databases and Functional-Style JavaScript to Write Gext-...
 
Acquia Platform Update: New Features and Capabilities
Acquia Platform Update: New Features and CapabilitiesAcquia Platform Update: New Features and Capabilities
Acquia Platform Update: New Features and Capabilities
 
Blender FX Gold Sketch Effect - Sailboat Sailing During Sunset
Blender FX Gold Sketch Effect - Sailboat Sailing During SunsetBlender FX Gold Sketch Effect - Sailboat Sailing During Sunset
Blender FX Gold Sketch Effect - Sailboat Sailing During Sunset
 
HTML5- The Boosting Era of Web Development
HTML5- The Boosting Era of Web DevelopmentHTML5- The Boosting Era of Web Development
HTML5- The Boosting Era of Web Development
 
Prototyping user interactions in web apps
Prototyping user interactions in web appsPrototyping user interactions in web apps
Prototyping user interactions in web apps
 

Plus de tutorialsruby

&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
tutorialsruby
 
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
tutorialsruby
 
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
tutorialsruby
 
&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
tutorialsruby
 
&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
tutorialsruby
 
Standardization and Knowledge Transfer – INS0
Standardization and Knowledge Transfer – INS0Standardization and Knowledge Transfer – INS0
Standardization and Knowledge Transfer – INS0
tutorialsruby
 
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa0602690047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
tutorialsruby
 
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa0602690047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
tutorialsruby
 
BloggingWithStyle_2008
BloggingWithStyle_2008BloggingWithStyle_2008
BloggingWithStyle_2008
tutorialsruby
 
BloggingWithStyle_2008
BloggingWithStyle_2008BloggingWithStyle_2008
BloggingWithStyle_2008
tutorialsruby
 
cascadingstylesheets
cascadingstylesheetscascadingstylesheets
cascadingstylesheets
tutorialsruby
 
cascadingstylesheets
cascadingstylesheetscascadingstylesheets
cascadingstylesheets
tutorialsruby
 

Plus de tutorialsruby (20)

&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
 
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
TopStyle Help &amp; &lt;b>Tutorial&lt;/b>
 
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
The Art Institute of Atlanta IMD 210 Fundamentals of Scripting &lt;b>...&lt;/b>
 
&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
 
&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />&lt;img src="../i/r_14.png" />
&lt;img src="../i/r_14.png" />
 
Standardization and Knowledge Transfer – INS0
Standardization and Knowledge Transfer – INS0Standardization and Knowledge Transfer – INS0
Standardization and Knowledge Transfer – INS0
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
 
xhtml-documentation
xhtml-documentationxhtml-documentation
xhtml-documentation
 
xhtml-documentation
xhtml-documentationxhtml-documentation
xhtml-documentation
 
CSS
CSSCSS
CSS
 
CSS
CSSCSS
CSS
 
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa0602690047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
 
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa0602690047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
0047ecaa6ea3e9ac0a13a2fe96f4de3bfd515c88f5d90c1fae79b956363d7f02c7fa060269
 
HowTo_CSS
HowTo_CSSHowTo_CSS
HowTo_CSS
 
HowTo_CSS
HowTo_CSSHowTo_CSS
HowTo_CSS
 
BloggingWithStyle_2008
BloggingWithStyle_2008BloggingWithStyle_2008
BloggingWithStyle_2008
 
BloggingWithStyle_2008
BloggingWithStyle_2008BloggingWithStyle_2008
BloggingWithStyle_2008
 
cascadingstylesheets
cascadingstylesheetscascadingstylesheets
cascadingstylesheets
 
cascadingstylesheets
cascadingstylesheetscascadingstylesheets
cascadingstylesheets
 

Dernier

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Dernier (20)

Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 

E-magazineDecember_sample

  • 1. Page 1DMXzone e-Magazine December 2008 e-Magazine
  • 2. e-Magazine Page 2DMXzone e-Magazine December 2008 Colofon & Introduction Publisher DMXzone is a division of Dynamic Zones International B.V. Mail address: PO Box 545 7500 AM Enschede The Netherlands Visiting address: Hengelosestraat 705 7521 PA Enschede The Netherlands Tel: +31 - 53 - 483 63 14 Fax: +31 - 53 - 433 74 15 info@dynamiczones.com www.dynamiczones.com All rights reserved. Copyright © 2008 Dynamic Zones International BV Unless otherwise noted, all of the writing in DMXzone Magazine is the copyrighted property of Dynamic Zones International BV. This copyrighted material includes all writing by staff, and some of the artwork, drawings and logos. You may print out any articles and tutorials for your personal use only. Materials may not be reproduced on another web site, book, or publication without express written permission. Any reproduction or editing without the explicit written permission of DMXzone Magazine is expressively prohibited. Certain names, logos, phrases, and artwork on these pages may constitute trademarks of Dynamic Zones International BV or its sponsors. Reproduction in whole or in part is strictly prohibited without written permission of Dynamic Zones International BV. Dynamic Zones International BV also cannot guarantee that all content and material appearing in the DMXzone Magazine is not infringing on any registered or non-registered copyrights. DMXzone Magazine is published monthly (12 times a year) by Dynamic Zones International BV. Interfaces & Widgets Improve your graphical user interfaces with cool controls using jQuery, Ajax and ASP.NET. Get inspired by Hollywood based photographer Brian McCarty who has a passion for toys and photography to the point of hypothermia. Dan Wellman will teach you how to code a cool pop-up emailer; the visitor enters their details, a friend’s email address and a short message into the form on the popup, and when they’re done the widget asynchronously passes the data, as well as the URL of the current page, to the server for conversion to mail format before sending. Kevin will learn you how to use the Accordion Ajax control to display large amounts of data on a single page by allowing sections of the content to be expanded and collapsed. After that he shows you how to create a Collapsible Panel control that allows you to independently expand/collapse different sections of the page without affecting the other sections. Learn how you can add a Panel control to a web form and have its contents always visible regardless of the scroll position of the page. This technique is used all over the internet and can be quite tricky to implement, but you can learn how in this tutorial without writing any client-side JavaScript whatsoever. CEO George Petrov magazine@dmxzone.com Chief Editor Frank Beverdam frank@dmxzone.com Technical Editor Patrick Woldberg patrick@dmxzone.com Illustrator Simon Saado Interview Brian McCarty Tania Antonova DTP Simon Saado Advertising George Petrov advertising@dmxzone.com Subscriptions Yearly subscription: € 24.99 2 year subscription: € 39.99 subscriptions@dmxzone.com
  • 3. Page 3DMXzone e-Magazine December 2008 List of Contents e-Magazine 18 39 40 54 12 31 41 24 Agenda DMXzone brings you the latest events, take a look to see what is going on in the world of web development and design. Coding a jQuery Plugin Part 2 In this part of the tutorial we’re going to continue adding the functionality that will enable our widget to work in the way that we want it to. Creating Accordion Collapsible Panels in ASP.NET In this video tutorial you'll learn how to use the Accordion Ajax control to display large amounts of data on a single page Creating Independent Collapsible Panels with Ajax in ASP.NET During this tutorial you will learn how you can create expandable/ collapsible sections of content on a page. Creating an Always Visible Container in ASP. NET During this tutorial you'll learn how you can add a Panel control to a web form and have its contents always visible regardless of the scroll position of the page. Coding a jQuery Plugin Part 3 Dan shows you how to add the functions for showing the popup when the link element is attached. He also shows you how to add the code for the AJAX success handler. Interview: Brian McCarty Hollywood based photographer Brian McCarty has passion for toys and photography to the point of hypothermia.. News We bring you the latest industry news, so don't hestitate and take a peek if you want to stay tuned with latest developments.. Coding a jQuery Plugin Part 1 Over the course of this tutorial we’ll be coding our very own jQuery plugin
  • 4. Event Date Place Page 4DMXzone e-Magazine December 2008 Agenda e-Magazine D-65Workshop December 12- 15 Austin,TX The D-65 workshops teach bulletproof techniques using Adobe Photoshop and new Photoshop Lightroom 2.0 to increase workflow productivity and save time. Web-Blast December 5 Sydney, Australia Web-blast is a huge end-of-year party for Sydney's web community - bringing together web designers,web project managers,interface designers. OZCHI 2008 December 8-12 Cairns, Australia OZCHI is Australia and New Zealand's leading forum for work in all areas of human-computer interaction. Web DesignWorld Boston December 8-10 Boston, Massachusetts, U.S.A. Web DesignWorld Boston is an incredible opportunity to gain insight and interact with some of the hottest designers / developers in the web industry.
  • 5. Page 5DMXzone e-Magazine December 2008 News e-Magazine NEWS SearchWiki: Your Own Search. Google launched SearchWiki, a way to customize search by re- ranking, deleting, adding, and commenting on search results. With just a single click you can move the results you like to the top or add a new site. You can also write notes attached to a particular site and remove results that you don't feel belong. These modifications will be shown to you every time you do the same search in the future. SearchWiki is available to signed-in Google us- ers. They store the changes in your Google Account. If you are won- dering if you are signed in, you can always check by noting if your user- name appears in the upper right- hand side of the page. The changes you make only affect your own searches. But Search- Wiki also is a great way to share your insights with other searchers. This new feature is an example of how search is becoming increas- ingly dynamic, giving people tools that make search even more useful to them in their daily lives. Google has been testing bits and pieces of SearchWiki for some time through live experiments, and they incorpo- rated much of our learnings into this release. Read it at the external site... Mac OS X Snow Leopard 10.6 Soon? Last week at Large Installation Sys- tem Administration ference(Lisa'08) Apple's director of Engineering of ix Technologies Jordan Hubbard anounced the date for Apple's Mac OS X 10.6 - 1st Quarter 2009. When Apple first previewed Snow Leopard at the Worldwide Devel- opers Conference 2008, they simply stated that Snow Leopard would ship "in about a year" from the an- nouncement. A Q1 release would deliver it earlier than most had ex- pected and makes it conceivable that we could see a demo or an- nouncement at Macworld San Francisco 2009. Apple has said that they would be focusing on both quality and per- formance in Snow Leopard. In par- ticular, Apple has made it clear that there will be efforts to improve sup- port for multi-core processors and GPU processing. These improve- ments will help developers more ef- ficiently use these capabilities that already ship in Macs. Read it at the external site... YouTube Tests Out High Quality, Stereo Surround Videos This week YouTube has started test- ing HD quality videos on a smatter- ing of its content. The new format could be a big move for YouTube, as the video size is over 80mb, which means that they are prob- ably the same H.264 encoded mp4 files available in the iTunes store.
  • 6. Page 6DMXzone e-Magazine December 2008 News e-Magazine NEWS The new formats have been avail- able on a few videos for a few months now, and a small hack can upgrade any video taped at a high enough quality. YouTube confirms this is part of their efforts to test out different video formats. The new format seems like real HD 720p video and looks clean and professional in the widescreen for- mat. It is possible to make YouTube's high quality video the default on the site, but formerly it was only possible to watch at a 480x360 resolution. Japanese website Google Mania claims that there is also an option to download video as an MP4, which would be big news as YouTube users have long desired that option, but the download link does not seem to appear on any of the U.S. versions. While these videos will result in slow- er loading and require powerful PCs for smooth playback, HD quality videos are a step in the right direc- tion for YouTube. Now if they can just work on getting a larger inven- tory of high quality content people want to watch on there, their ad model will be in business. Read it at the external site... Lively No More In July Google launched Lively in Google Labs because they want- ed users to be able to interact with their friends and express themselves online in new ways. Google has al- ways been supportive of this kind of experimentation because they believe it's the best way to create groundbraking products that make a difference to people's lives. But they've also always accepted that when you take these kinds ot risks not every bet is going to pay off. The new formats have been avail- able on a few videos for a few months now, and a small hack can upgrade any video taped at a high enough quality. YouTube confirms this is part of their efforts to test out different video formats. The new format seems like real HD 720p video and looks clean and professional in the widescreen for- mat. It is possible to make YouTube's high quality video the default on the site, but formerly it was only possible to watch at a 480x360 resolution. Japanese website Google Mania claims that there is also an option to download video as an MP4, which would be big news as YouTube users have long desired that option, but the download link does not seem to appear on any of the U.S. versions. While these videos will result in slow- er loading and require powerful PCs for smooth playback, HD quality videos are a step in the right direc- tion for YouTube. Now if they can just work on getting a larger inven- tory of high quality content people want to watch on there, their ad model will be in business. Read it at the external site...
  • 7. Page 7DMXzone e-Magazine December 2008 News e-Magazine NEWS IE8: What's After Beta 2? Since the release of Beta 2,the data from real people about the product has been absorbed. The IE team has combed through instrumentation of over 20 million IE sessions and hun- dredsofhoursofusabilitylabsessions. Together with IE MVPs, they have scrutinized thousands of threads from user forums and examined the issues that people are raising. IE teаm will release one more public update of IE8 in the first quarter of 2009, and then follow that up with the final release. Their next pub- lic release of IE indicates the end of the beta period. They want the technical community of people and organizations interested in web browsers to take this update as a strong signal that IE8 is effectively complete and done. They should expect the final product to behave as this update does. They want them to test their sites and services with IE8, make any changes they feel are necessary for the best pos- sible customer experience using IE8, and report any critical issues (e.g., is- sues impacting robustness, security, backwards compatibility, or com- pleteness with respect to planned standards work). The plan is to de- liver the final product after listening for feedback about critical issues. They will be very selective about what changes they make between the next update and final release act on the most critical issues. Read it at the external site... FOIA Docs Show Feds Can Lojack Mobiles Without Tel- co Help Courts in recent years have been raising the evidentiary bar law en- forcement agents must meet in or- der to obtain historical cell phone records that reveal information about a target's location. But doc- uments obtained by civil liberties groups under a Freedom of Infor- mation Act request suggest that "triggerfish" technology can be used to pinpoint cell phones without in- volving cell phone providers at all. Triggerfish, also known as cell-site simulators or digital analyzers, are nothing new: the technology was used in the 1990s to hunt down re- nowned hacker Kevin Mitnick. By posingasacelltower,triggerfishtrick nearby cell phones into transmitting theirserialnumbers,phonenumbers, and other data to law enforcement. Most previous descriptions of the technology, however, suggested that because of range limitations, triggerfish were only useful for zero- ing in on a phone's precise location once cooperative cell providers had given a general location.
  • 8. Page 8DMXzone e-Magazine December 2008 News e-Magazine NEWS In a post on the progressive blog Daily Kos, ACLU spokesperson Rachel Myers drew attention to language in several of those docu- ments implying that triggerfish have broader application than previously believed. Тhe Justice Department's electronic surveillance manual explicitly sug- gests that triggerfish may be used to avoid restrictions in statutes like CALEA that bar the use of pen reg- ister or trap-and-trace devices— which allow tracking of incoming and outgoing calls from a phone subject to much less stringent evi- dentiary standards—to gather loca- tion data. By its very terms, according to the manual, this prohibition applies only to information collected by a provider and not to information collected directly by law enforce- ment authorities.Thus, CALEA does not bar the use of pen/trap orders to authorize the use of cell phone tracking devices used to locate tar- geted cell phones. Read it at the external site... Microsoft Likes Search Deal With Yahoo Microsoft is interested in resuming talks on a Web search partnership with Yahoo. Yahoo shares fell 19 percent on the remarks, after gain- ing this week on renewed investor hopes that Microsoft may refresh its bid for the Internet company after Yahoo Chief Executive Jerry Yang announced that he would step down. Microsoft withdrew its $47.5 billion buyout offer for Yahoo in May after Yang and his board rejected the bid as too low. The software com- pany then offered to buy Yahoo's search business, but Yahoo decid- ed instead to sign a search advertis- ing deal with Google Inc The Google deal has since fallen apart, after opposition from U.S. antitrust regulators who were con- cerned about an alliance between the Web's two biggest search com- panies. Microsoft has said that it was still in- terested in pursuing a search deal with Yahoo. There's no active dis- cussion on that front but Microsoft would be very open to it. Ballmer said that Microsoft is look- ing for areas to cut costs, including hiring, which "points to much, much slower growth...in head count for the remainder of this financial year and that he suspects into next finan- cial year.However, investment in research and development would continue. Read it at the external site... Which Browser is King? The best way to find out which browser suits you the most is simply to run only one test for a brows- er: whether it runs fast enough. A slow-loading, incompatible brows- er is one thing, but the real issue is whether a browser loads fast for the sites you frequently visit.
  • 9. Page 9DMXzone e-Magazine December 2008 News e-Magazine NEWS V8 Benchmark Suite This test measures JavaScript speed for rich Web applications. Obviously, Chrome includes the V8 code and the other browsers do not. They test- ed the version of Firefox (called Mine- field) that does include the V8 code and listed those results below the "of- ficial" findings. The V8 Benchmark Suite loads JavaS- cript code to test OS kernel, encryp- tion and decryption, raytracing, and other tests to measure the speed of a rich JavaScript application. Winner— Google Chrome. Browser Extensions SVG and Canvas extensions are used for more complex XML renderings where data is pulled from an external source. The test loads vector images into the browser window. IE7 does not support the SVG and Canvas test, and Microsoft advised ExtremeTech against using the IE8 beta, which is still early. The differences don't seem so mas- sive, though IE7's inability to run these extensions is problematic. IE8 will fix that compatibility issue, but Micro- soft's code isn't yet optimized. Acid 3 Test Acid3 is a compatibility test that meas- ures the default settings in a browser, plays an animation, and compares the resulting image to a reference image. There's a final compatibility score, and a pass/fail system—the browser must score 100 out of 100 to pass, and none of the browser we used passed. Once again, IE7 did not even run the test correctly and pro- duced no final score. Winner - Opera. Adobe Flash Flash has become increasingly com- mon, and the rendering engine for each browser is the same—once you have Flash installed, it is used for each browser. The crab test adds animat- ed crabs on the screen in succession until the animation rate goes below 25 frames per second. Firefox trumped all of the other brows- ers, animating ten additional crabs on the screen—well ahead of the sec- ond place finishers. We also tested IE8 to see if Microsoft had improved Flash rendering—apparently not. Winner - Mozilla Firefox. Read it at the external site... Microsoft is Back on Track with Vista SP2 From the other side of the world comes a report that Windows Vista Service Pack 2 will be released to manufacturing in April 2009, roughly a year after SP1. The Malaysian web- site TechARP has a pretty good track record with this sort of prediction, and my sources tell me that schedule sounds about right. If Vista SP2 does make its official ap- pearance in April, it will mark a return to normal development and release cycles for Microsoft, which lost its way badly with Windows XP. As measured by service pack releas- es, the XP era was a distinct anomaly for Microsoft. Over the past 12 years, Microsoft has delivered 14 Windows service packs. The gap between SP1 and SP2 was a record 697 days, near- ly two full years. But that pales in com- parison to the gap between SP2 and SP3, which was nearly four years. If we throw out SP3 and also disregard NT4 SP2, which appeared a mere 59 days after its predecessor, we discover that the average gap between serv- ice-pack releases is around 300 days, or just under a year apart.
  • 10. Page 10DMXzone e-Magazine December 2008 News e-Magazine NEWS If Vista SP2 arrives in mid-April 2009, it will be 355 days since its predecessor, or very close to the historical averag- es. Beginning with Windows Vista, Micro- soft is using Windows Update to de- liver reliability, compatibility, and per- formance fixes in addition to security patches. For Windows users, this is a new development. Windows XP us- ers never got this type of update, but Vista users were treated to a steady stream of them. Read it at the external site... Sun Warns of Bugs as it Re- leases MySQL 5.1 Sun has released version 5.1 of the open-source MySQL database soft- ware, but the software's founder si- multaneously warned of a number of bugs present in the new features that are still to be fixed. The founder of MySQL, Michael 'Mon- ty' Widenius, stated in a blog post on Saturday that most of the issues iden- tified were serious or crashing bugs. There are also a number of older, known bugs that are still present in this release. The new features introduced have been ranked as 'beta' quality. There are a number of issues associated with the partitioning feature. Row-based replication has not been enabled by default, because of a number of problems. Users are ad- vised to test the latest MySQL version before deploying it to production sys- tems. Read it at the external site... Lunacore - the multi-engine browser Lunascape includes Trident (Internet Explorer), Gecko (Firefox) and WebKit (Safari & Chrome) rendering engines allowing the user to switch on-the-fly between them. The Janapeese company claims that their browser is the best at handling JavaScript - according to SunSpide JavaScript benchmarking tool, the new browser demonstrates twice as better results in respect to FireFox3 and even has superiority over Goog- le Chrome, considered for the fastest browser at the moment. Lunascape automatically switches between the rendering engines - all the user needs to do is to indicate the rendering method once per site. The current release of Lunascape is still in Alpha, and available just for Mi- crosoft Windows. There is still no offi- cial date for the retail release. Read it at the external site... Move over, Ajax. Here comes Microsoft's "Kojax" Kojax is a mobile development plat- form, that will allow Microsoft- and third-party-developed — applets run in an Ajax-like way, using a combina- tion of Visual Studio tools and JavaS- cript, on Java-based mobile phones.
  • 11. Page 11DMXzone e-Magazine December 2008 News e-Magazine NEWS What kinds of mobile applets are we talking about here? Something like a virtual wallet for online payments, a group messaging service and photo- sharing app — things that build on top of Windows Live for Mobile services. Some of these Kojax-based applets will ad-funded; others will likely be transaction- and subscription-based. Another interesting part of the Kojax tips I’ve received: Microsoft allegedly is aiming its Kojax applet plans prima- rily at users in emerging markets. The Kojax work may or may not be re- lated to a recent Unlimited Potential initiative known as “Mobile First.” Mo- bile First is all about users whose first Microsoft-related experience tends to be in the mobile-phone, rather than the PC, realm. Read it at the external site... Window7 taskbar: Most Inter- esting Part of the New OS? The most interesting feature about the new OS is the taskbar. But it's also the most cloaked in mystery, as it was not part of the pre-beta Windows 7 software handed out to attendees at Microsoft's PDC (Professional Devel- opers Conference) last month. Microsoft does seem to be trying to break new ground with the look, feel, and functionality of the Windows 7 taskbar. Unified quick launch and taskband Microsoft has merged Quick Launch and the taskband into a big, happy launching and switching family. But- tons in the Quick Launch bar that open a program turn into a window switcher when launched. This may not be a new concept, but Microsoft says that the difference with Windows 7 is that no matter how many, say, IE browsers you have open, and whether or not they are minimized or maximized, there will only be a single representation of IE on the taskbar. This is the default set- ting and you have the freedom to have as many buttons as you want. Interactive, grouped tumbnails The Windows Vista taskbar shows cor- responding thumbnails when you mouse over a taskbar button, but in Windows 7, these thumbnails are click- able, allowing you to open, close, or switch between windows right from the thumbnails. Also, each thumbnail looks like a mini version of the window it is representing, be it a Web browser, Word document, or PowerPoint ap- plication. Aero peek The functionality of Vista's Aero graph- ical interface has been extended. The "Aero Peek" feature in Windows 7 should come in handy when your thumbnails are e-mails or Word docu- ments with text and details that are too small to recognize. Why squint if you don't have to? Aero Peek displays the actual, full-size window on the desktop of the thumb- nail you are hovering over. Not only that, but all other windows open on the desktop become transparent-or turn into "glass sheets" to use Micro- soft lingo -- so you can focus quickly on the window you want. Jump list The advantage of Jump Lists, is that you don't need to start a program to quickly launch a file or access a task; you just right-click on a button. The files in the Jump List don't take up space on the taskbar; they are auto- matically organized by their respec- tive program in a list. Read it at the external site...
  • 12. Page 12DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 1 e-Magazine Over the course of this tutorial we’ll be coding our very own jQuery plugin that will sit on top of the excellent foundation provided by jQuery and function like a jQuery UI widget. We’ll be making the most of the object-oriented features of both jQuery and of JavaScript itself and getting down to some quality coding using the lat- est best-practice techniques.
  • 13. Page 13DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 1 e-Magazine The widget we’ll be creating is a pop-up emailer; the visitor enters their details, a friend’s email address and a short message into the form on the popup, and when they’re done the widget asynchronously passes the data, as well as the URL of the current page, to the server for conversion to mail format before sending. The plugin itself consists of just the front end; a backend application will also be required, which we can code nearer the end of the tutorial. The following screenshot shows what we’ll be constructing: jQuery provides an object-oriented construct that makes coding a plugin particularly easy, as you’ll see. As well as looking at the code needed to produce this simple widget, we’ll also be focusing on the programming style and general recommendations that we should meet when writing plugins specifically for jQuery. Getting Started First we need to setup an appropriate environment the various files that our widget depends upon can work in. Create a new folder somewhere convenient and call it jMailer; within this folder create two additional folders and call them img and jquery. Download a copy of the latest stable release of the jQuery library (if you don’t have one already) and place it in the jquery folder. The JavaScript file that makes up jQuery has the version number appended to the end of the filename; remove the version number, leaving the file called simply jquery.js. There should be a code download with this tutorial, download that too and unpack the images into the img folder. Now we’re ready to go, we’ll start off with the JavaScript, which should go into its own file. A specific naming convention should be used for a jQuery plugin; the main JavaScript file should be called jquery. pluginName.js. A good practice we can set up here before we add any code is to think about how we are going to indent our code. It’s a small thing I know, but to make more code readable it should always be indented. Coding a jQuery Plugin Part 1 Dan Wellman
  • 14. Page 18DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 2 e-Magazine Welcome back to part 2 of the jQuery plugin creation tutorial; in part one we created our protected-properties and configurable properties, as well as the object that will make up our plugin. We added the method that developers will call to create an instance of our widget.
  • 15. Page 19DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 2 e-Magazine In this part of the tutorial we’re going to continue adding the functionality that will enable our widget to work in the way that we want it to. All of the functions left to add are internal methods shielded from the developer that are required internally by the plugin. Let’s make a start. Adding More Functionality When we added our method, we saw that it called two functions (well, it called one function, but the click handler we added within it also called a function). The first of these was the createMailer function which will do the bulk of the work. We can add the code for this next. After our main method (the one that uses the fn.extend method) add the following code: This is rather a long function so we’ll look at it step-by- step; first we need to overcome an IE6 bug if IE6 is the browser is use. We check our ie6 property to see if it is set to true and if so we add some styling to the <body> of the page. If we don’t do this, the overlay will not cover the entire page if and when it appears. This is done using the trusty JavaScript ternary conditional construct. Next we create the containing element for our mailer form; this is done with a freshly baked <div> courtesy of jQuery. As the developer is free to set a different id for the instance of the widget, we can’t refer to the mailer using a specific id. Our function accepts the configuration object as an argument so we simply get the id property from this and add it as the id attribute of the new <div>. We also set some CSS properties of the new <div>, including display:”none” because we don’t want the form displayed straight away. Once this has been done we append it to the end of the <body> ready to appear when necessary. Next we create a <fieldset> element to hold the various fields within our form (it’s not truly a form because there’s no form element, but we’ll be submitting it via AJAX anyway so it’s not strictly necessary). Again we set an id and some CSS properties before appending it to the container <div> we created a moment ago, again referring to the container using the config.id property. We can now move on to create the elements of the form, we’ll need some label-like elements and some input fields to capture the visitor’s data. The most Coding a jQuery Plugin Part 2 Dan Wellman function createMailer(config, url) { //normalize body if ie6 (ie6 == true) ? $(“body”).css({padding:”0”, margin:”0”}).width(“100%”).height(“100%”) : null ; //create mailer div $(“<div>“).attr(“id”, config.id).addClass(“mailerDiv”). css({backgroundColor:”#cccccc”, padding:”10px 5px 30px 0”, display:”none”, position:”absolute”, zIndex:”99999”, width:”300px”}).appendTo($(“body”)); //create mailer form $(“<fieldset>“).attr({id:”mailerForm”}). css({border:0,padding:0}).appendTo(“#” + config.id);
  • 16. Page 24DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 3 e-Magazine
  • 17. Page 25DMXzone e-Magazine December 2008 Coding a jQuery Plugin Part 3 e-Magazine Coding a jQuery Plugin Part 3 We now reached part 3 of the jQuery plugin authoring tutorial; we’ve now added most of the functionality for our plugin, but there are still a number of loose ends that need to be tied up; namely, we still need to add the functions for showing the popup when the link element is attached, as well as add the code for the AJAX success handler. The show function receives the same configuration object as our previous functions did, and the first thing we do is check whether modality is enabled. If it is we create an overlay element that will sit behind the popup, but in front of the rest of the page content. Instead of relying solely on the z-index stacking order, we insert the overlay directly before the already created widget, which prevents IE from tripping over its own feet and getting confused about which element should appear on top. In part 2 of this tutorial I mentioned that we’d be creating an iframe shim when the browser in use is IE6 (or when the shim property is set to true); the next part of code checks the shim property and creates the new <iframe> element if it is set to true. There are some required attributes we need to set, as well as some CSS styles before the element is inserted into the DOM directly before the overlay. Coding a jQuery Plugin Part 3 Dan Wellman function show(config) { //create modal if set to true (config.modal == true) ? $(“<div>“).attr(“id”, “overlay”).css({ opacity:0.7, backgroundColor:”#000000”, zIndex:99990, height:”100%”, width:”100%”, position:”absolute”, top:0, left:0 }).insertBefore(“#” + config.id) : null ; //create shim if enabled (config.shim == true) ? $(“<iframe>“).attr({ src:”“, frameBorder:”0”, scrolling:”no”, id:”shim” }).css({ display:”block”, zIndex:99989, opacity:0, height:”100%”, width:”100%”, position:”absolute”, top:0, left:0 }).insertBefore(“#overlay”) : null ; //set mailer position var left = vDim.width / 2 - $(“#” + config.id).width() / 2; var top = vDim.height / 2 - $(“#” + config.id).height() / 2; //remove error message and styling if present (!$(“.errorMsg”)) ? null : $(“.errorMsg”).remove(); $(“#” + config.id + “ input”).each(function(){ $(this).css({border:”1px solid #abadb3”}); $(this).prev().css({color:”#000000”}); }); //show mailer $(“#” + config.id).css({left:left, top:top}).show(“slow”); };
  • 18. Page 31DMXzone e-Magazine December 2008 Interview: Brian McCarty e-Magazine Hollywood based photographer Brian McCarty has a passion for toys and photography to the point of hypothermia.
  • 19. Page 32DMXzone e-Magazine December 2008 Interview: Brian McCarty e-Magazine Where does your passion for toys come from? I’ve always had a passion for toys. About the time I was supposed to grow up and stop playing with toys, they became subjects of my early, fumbling experiments with photography. They’ve always held magic for me. They are organic icons, totems of who we are as a culture. Toys help children learn to be adults and remind adults of how to think like a child. What inspires you? A better question might be what doesn’t inspire me. The things I absorb in everyday life are reflected and refracted through my work. From places to people, from books to movies, it all strikes a chord. Music is of particular importance to me. I’ll often focus on a particular piece while shooting or working in my sketchbook. As for what artists inspire me the most, I admire the work of a number of documentary photographers, like Robert Frank, Helen Levitt, Bruce Davidson, and Eugene Richards. They capture and highlight reality from such distinct perspectives, finding beauty in the mundane and sometimes grotesque. "Toys help children learn to be adults and remind adults of how to think like a child"
  • 20. Page 33DMXzone e-Magazine December 2008 Interview: Brian McCarty e-Magazine
  • 21. Page 39DMXzone e-Magazine December 2008 Creating Accordion Collapsible Panels in ASP.NET e-Magazine In this video tutorial you'll learn how to use the Accordion Ajax control to display large amounts of data on a single page by allowing sections of the content to be expanded/collapsed.
  • 22. Page 40DMXzone e-Magazine December 2008 Creating Independent Collapsible Panels with Ajax in ASP.NET e-Magazine Welcome to Creating Independent Collapsible Panels with Ajax in ASP.NET During this tutorial you will learn how you can create expandable/collapsible sections of content on a page. Unlike the Accordion control which only allows a single section of content to be displayed, the Collapsible Panel control allows you to independently expand/collapse different sections of the page without affecting the other sections
  • 23. Page 41DMXzone e-Magazine December 2008 Creating an Always Visible Container in ASP.NET e-Magazine During this tutorial you'll learn how you can add a Panel control to a web form and have its contents always visible regardless of the scroll position of the page. This technique is used all over the internet and can be quite tricky to implement, but you can learn how in this tutorial without writing any client-side javascript whatsoever.
  • 24. Page 42DMXzone e-Magazine November 2008 Next Edition e-Magazine