Dual Screen as the name suggests helps you to work in two screens simultaneously. They are extremely helpful if you are working on many projects at the same time and do not like the idea of frequently switching on from one screen to another. It consumes less time from your side and you do not have to wait to look at your results.

By viewing image in a dual screen you can display your image in a wider scale and you can also set higher resolutions which greatly increases the clarity of the image and gives a stunning visual appeal to the viewer. Not only in displaying wallpapers but you can use the concept of dual screens where you can edit the changes in one screen and view the results in another.If you are a web designer or really like to play with different moods of nature, this concept could give you an environment where you could show the nature changing its colors in a subtle manner in two wide screens. Not only the moods you could also show the changing climate with the help of additional monitors and if in a classroom showing a demonstration you could have anatomy of a flower in one screen and the description part in another screen.The below presentation of “Beautiful dual screen wallpapers“are  in different categories of resolutions up to 2560 x 1024 px and resources of where to collect these.

Nature categories

1.Butterfly dual effect

Enjoying the sweet nectar on a bright sunny day.

2.Pale orchid in dual screen

3.Bunch of roses

4.Spring Pink

5.Yellow in its Brightness

6.Orchid

7.Majestic Sunset horizon

8.Bright Nature

9.West Coast

Goodbye for Today.

10.Tulips

11.West Lake at Sunset

12.Yellow One

Animals and Birds

13.Tiger’s Look

14.Lizard on a Trunk

Enjoying the same color.

15.Racoon

16.Where is my Predator?

17.Hey You

18.Three Brother Wolves

Happy in our friendship.

19.Stare of a Tiger

Pride of a tiger – Looks.

20.Lizard

Relishing the warmth of nature .

21.White Tiger

22.Parrot

23.Black Beauty

A rare combination of nature with its varied colors in this black beauty.

24.Flamingos

25.Odonata

Fantasy Art

Fantasy art is high and strongly linked to fantasy fiction. Indeed fantasy art pictures are often intended to represent specific characters or scenes from works of fantasy literature. Such works created by amateur artists may be called fan art.

26.The Big Reveal

27. Morning View

28. An Untamed horse

29.A Dreamy Scene

30.Strange World

31.Hazy view

32.A Dreamy World in Wide Screen

33.Dreamy World

34.Back Draft

35.Wind Mill

36.Sunset over Moorea

37.All alone in this World

38.Blue Forest

39.To Nowhere

Abstract wallpapers

Abstract wallpaper, non figurative wallpaper, nonobjective wallpaper, and nonrepresentational wallpaper are loosely related terms. They are similar, although perhaps not of identical meaning.Abstraction indicates a departure from reality in depiction of imagery in art.

40.Mushroom Samba

41.Dual monitor floral

42.Swirlz

43.14 the War

44.Splash of paint

Flow of paint as a wonderful painting.

45.Splash

46.Jincy

47.Display of bright colors

48.Feeding Time

49.Plasmoid Neophile

50. Generator

51.Destruction

52.Bokeh Remix

53.Apple i-pad

3D dual screen wallpapers

One important interesting wallpaper category is three dimensional (3D) desktop backgrounds.Here we bring our best.

54.Boy & Butterfly

55.Classic Design

56.Skull Cog

57.Water Colored

58.Fedora

59.Six of a kind

60. Abstract Pink

61.Greatest Invention

62.RTX Wallapaper

63.Multi Display Nights

Miscellaneous

Made up of a variety of parts or ingredients having a variety of characteristics, abilities, or appearances.

64.Spawning sunflowers

65.Ghost view

66.Super Mario Galaxy

67.Crocket Red Dual

68.Cat Wallpaper

69.Tropical isle

70.Yin and Yang

Further Resources & Origin

1. Dualmonitorbackgrounds
This site is dediacted to dual monitor wallpapers in various categories where you can download them for free and also update any wallpapers if you want to.

2. Dualscreenwallpaper
Variety of wallpapers according to the resolutions and with different categories.

3. Wallpaperpimper
Display of over 400 images which could be easily navigated keeping the user friendliness in mind especially for dual monitors.

4. 3datadesign
A visual treat in 3-d format with high resolution of 3200 x 1200 and 2560 x 1024.

5. Pni.princeton
Wallpapers describing nature in resolutions of 1280 x 1024.

6. Hongkiat
A list of 70 smashing cool nature wall papers.

7. Instantshift

To refresh your memory and to spice up your desktop with a list of wallpapers.

8.Marcoofolio

For Widescreen and Breathtaking dual screen wallapapers visit the link..

9. Plasmadesign
Wallpapers are categorised into landscape and abstract and are in the resolutions of 3200 x 1200.

10. Wallcoo
Delightful display of more than 150 wallapapers in high quality.

11. Wall.alphacoders
A visual tour showing Earth, Space, Sci- Fi and many more in dual monitor mode.

12. Digitalblasphemy
Digital format of wallpapers to give a fresh look to your screens..

13. Mandolux
Go through your wallapapers seperately in right, middle and left monitors.

14. 2expertsdesign

More than 600 designs to give a tough test to your choice.

15.Ewallpapers

This site boasts of more than 600 images in resolutions of 2560 x 1024 categorised under different headings.

16. Epicwallpaper
Abstract wallpapers for your screens.

17. Socwall
A soceity of social wallpaers with resolution of 2560 x 1024, 3200 x 1200.

Welcome back to jQuery for Beginners. Just a quick recap first – in the first two weeks we covered the very basics of jQuery and interacting with elements. Last time round we made an accordion – something which taught us a few of the jQuery special animation functions that are built in to jQuery. Today we will be using those functions and a bit more as we look at creating a nice looking Gallery page, built with HTML and CSS, and then adding some nice interactive effects with jQuery.You can see the live demo here. You can also download the source code here.

Firstly, open up a new HTML page, add the basic HTML code and then include jQuery like so:

 	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script> 	<script type="text/javascript">  	</script> 

I’ve also added another script tag that is blank. This is where our code will go. Notice that when I included jQuery from the Google CDN (we covered this back in the first post) I’ve used “jquery/1/jquery.min.js”. Using just “1″ means we will automatically be given the most recent version of jQuery, until we get to jQuery 2, which is a fair way off for now. You could be much more specific, of course, if you wished, but for me it makes logical sense to keep up to date with the most recent versions.

Now we’ve got that sorted, I’ve got a basic HTML structure for our gallery, ready made with five images. If you go to the bottom of this post, you can download them, along with the completed code.

 div id="gallery"> 		<div class="galleryitem"><img src="image1.jpg" alt="A beautiful Sunset over a field" /><p>A beautiful Sunset over a field</p></div> 		<div class="galleryitem"><img src="image2.jpg" alt="Some penguins on the beach" /><p>Some penguins on the beach</p></div> 		<div class="galleryitem"><img src="image3.jpg" alt="The sun trying to break through the clouds" /><p>The sun trying to break through the clouds</p></div> 		<div class="galleryitem"><img src="image4.jpg" alt="Palm tress on a sunny day" /><p>Palm tress on a sunny day</p></div> 		<div class="galleryitem"><img src="image5.jpg" alt="The sun bursting through the tall grass" /><p>The sun bursting through the tall grass</p></div> 	</div> 

Next up we will apply some CSS styling to make it look nicer. Seeing as this is a jQuery tutorial, I’m not going to explain much of this. Essentially I’m just adding a border, styling the font and floating the images so they display next to each other.

 	#gallery {width: 960px; margin: 0 auto;} 		.galleryitem {width: 300px; height: 300px;float: left; font-family: Lucida Sans Unicode, Arial; font-style: italic; font-size: 13px; border: 5px solid black; margin: 3px;} 		.galleryitem img {width: 300px;} 		.galleryitem p {text-indent: 15px;} 

And your page should look something like this:

Looks pretty good!

Our next step is going to be some jQuery. At last! We are going to remove the paragraphs and make them appear on hover, with some nice CSS styling to make them look really nice. What I’ve done is create a CSS id which we will apply to a paragraph when the corresponding image is hovered over:

 	#galleryhoverp { margin-top: -55px; background-color: black; opacity: 0.5; 		-moz-opacity: 0.5; 		filter:alpha(opacity=50); height: 40px; color: white; padding-top: 10px;} 

So our first step is to hide all the paragraphs and then resize our gallery items so just the image is displayed. We’ll also save all our gallery items to a variable for later usage.

 	$('p').hide(); 	var galleryItems = $('.galleryitem'); 		galleryItems.css('height', '200px'); 

And now lets add an effect for when the gallery item is hovered over. Firstly lets find all the images and save them.

 var images = $('.galleryitem').find('img'); 

The hover function is slightly unusual in that it takes two functions. The first is what should happen when the image is hovered over, the second when the mouse stops hovering over that image.

 	galleryItems.hover( 			function() { 				//when hovered over 			}, 			function() { 				//when hovered ends 			} 		) 

The code is very simple. We just select the next paragraph using the next() function, show it and then give it that id we created a while back. On the hover-out function, we just do the exact opposite:

 galleryItems.hover( 			function() { 				$(this).children("id").next('p').show().attr('id', 'galleryhoverp'); 			}, 			function() { 				$(this).children("id").next('p').hide().attr('id', ''); 			} 		) 

And there you go! If you try it out now you should see the paragraphs show when you hover over, and then leave when you change to a different image.

There is one more effect we will add. When you click on an image, it should enlarge, fill the centre of the screen and all the other images disappear. Again, I’m creating some CSS which we will add to the image we want to display:

 #singleimagedisplay {width: 800px;} #singleimagedisplay img {width: 800px;} #singleimagedisplay a {float: right; color: white;} 

We’ll add this code to the image’s parent – the div with a class of ‘galleryitem’. The code for the entire click event is below:

 	images.click(function() { 			$(this).parent().attr('id', 'singleimagedisplay').css('height', $(this).height()).siblings().hide(); 			$(this).next('p').show().html($(this).next('p').html() + '<a href="jquery1.html">Back</a>');  		}) 

So, when each image is clicked, these are the steps we take:
1. Give the id of ’singleimagedisplay’ to the image’s parent.
2. Set the height of the image parent to the height of the image. This uses jQuery’s height() function, which finds the height of the specified item.
3. Select all the other gallery item divs using siblings() and hide them.
4. Edit the paragraph that comes with the image to have a link on the end, which links back to the home page. jQuery’s HTML function allows us to edit the HTML code with in an item, but only if we put something inside the brackets. Else, it just gets us the value. So .html() gets the code inside the paragraph, and html(‘new stuff’) changes the content of the paragraph. Bear in mind, if you use .text() or .text(‘hello’) that will just edit the text, but if you wish to add HTML code inside an item, you need to use html().

And if you check out your page, you will find it works! There is one final issue. When viewing a single image, if you hover out, the paragraph goes away. We don’t want this, so we need to go back to our hover function and make a slight edit:

 galleryItems.hover( 			function() { 				if($(this).attr('id')!='singleimagedisplay') 				{  					$(this).children("img").next('p').show().attr('id', 'galleryhoverp'); 				}  			}, 			function() { 				if($(this).attr('id')!='singleimagedisplay') 				{ 					$(this).children("img").next('p').hide().attr('id', ''); 				} 			} 		); 

All we do is see if the id on the item is not set to ’singleimagedisplay’ which means that we are on the main gallery page, and then we can run the code we had originally. And we are done. You can download everything below:

Download the page and images.

I hope you found this a useful lesson, and I will see you next time.