Hi, I've tried searching online for how the below is acheived, but I'm not finding anything...

 

I want to know how this chap has got his portfolio sliding through on the laptop image and if there's a template I could use to get the same effect.

 

link

 

Thanks to anyone who can advise.

There is an ever-expanding choice of different jQuery sliders on the net. All that they've done is set the background image of the slider to an image of a laptop.

 

Here's 21,500,000 slider suggestions: http://goo.gl/VCLJn

There is an ever-expanding choice of different jQuery sliders on the net. All that they've done is set the background image of the slider to an image of a laptop.

 

Here's 21,500,000 slider suggestions: http://goo.gl/VCLJn

 

I had a feeling that was what it was, but I haven't a clue how to change the background to a laptop.

 

When I search for jQuery slider laptop, it messes the results up and comes back with laptop sales.

 

Thanks anyway bud

I had a feeling that was what it was, but I haven't a clue how to change the background to a laptop.

 

When I search for jQuery slider laptop, it messes the results up and comes back with laptop sales.

 

Thanks anyway bud

 

Make a standard jQuery slideshow - put it in place on your webpage then screenshot, paste into Photoshop (or whatever program you use) then design/buy/photograph an image of a laptop and place it as you want it. Once it looks right save only the image of the laptop and position it correctly using CSS on your webpage.

 

 

(easiest way of doing it that I have tried).

Edited September 9, 201114 yr by Alluziion

I like Nivo slider.its easy and simple http://nivo.dev7studios.com/ also check this out http://www.designyourway.net/blog/resources/28-useful-jquery-sliders-you-need-to-download/

Make a standard jQuery slideshow - put it in place on your webpage then screenshot, paste into Photoshop (or whatever program you use) then design/buy/photograph an image of a laptop and place it as you want it. Once it looks right save only the image of the laptop and position it correctly using CSS on your webpage.

 

 

(easiest way of doing it that I have tried).

 

You make it sound so easy lol.

 

I don't suppose you followed a tutorial at all?

Does anyone know if I can purchase this? I don't think I can make it myself...

you can also create this using flash

Use Nivoslider.

 

<div id="laptop_bg">

<div id="slider_position">

<?php if (function_exists('simple_nivo_slider')) simple_nivo_slider(); ?> <!-- or something -->

</div>

</div>

 

Make the #laptop_bg a laptop, and position the #slider_position over the screen.

Edited September 21, 201114 yr by John Fotios