Kapalı

Expand boxes in two directions by clicking

Expand boxes in two directions by clicking

On the home page of a site that I am building I have five boxes at the top, each with their own content. When the user clicks anywhere in one of the boxes the box should expand to the space occupied by all five boxes, covering them. I should be able to have any content in the first view and any content, including images, in the second box, and as the box expands the old content should gradually fade out and the new content should gradually appear. In the new larger box there should be a large X at the upper right. When the user clicks the X the box should gradually shrink until it reaches the original size and all the other boxes should reappear.

This is pretty much working on my site now except that it is working on hover, not on click. You can see it here: http://162.247.143.50. The box at the upper left is expanding to the right and down, covering the other boxes (it should cover all five, not just four). The other boxes should do the same thing.

I am hoping to use lightweight, quick and reliable code, preferably css alone but possibly javascript?

Thanks,

Geoff

Beceriler: CSS, Javascript, Yazılım Mimarisi

Daha fazlasını gör: work small radio station plays songscds original cd storage cases cds randomly put storagestyle boxes , expand collapse div taking clicks, create original logo, original essays 955, getting rid borders boxes oscommerce, tick boxes microsoft, macros input boxes, clicking close program, original english website

İşveren Hakkında:
( 4 değerlendirme ) Anchorage, United States

Proje NO: #8906515

Bu iş için 14 freelancer ortalamada $84 teklif veriyor

webiglobe

Dear Sir, I am really interested to work on this project . I have very good experience of doing this sort of job, I can start the work now and can assure the best service from my end. I am waiting here to discuss Daha Fazla

$135 USD in 2 gün içinde
(163 Değerlendirme)
6.8
anamaria1979

Propunerea nu a fost încă furnizată

$155 USD in 0 gün içinde
(117 Değerlendirme)
6.7
vishwanath89

So basically i would have to change the hover to click and make the upper left to hide all? Can start [login to view URL] you provide ftp access or give me the files?

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(46 Değerlendirme)
6.0
mysticwanderer70

Hi, my name is Joe. Here's my proposal for your project. The sizing and transitions will be done though css. The addition of the close button will be done in css as well - perhaps by inserting a web font. The mouse cli Daha Fazla

$35 USD in 2 gün içinde
(26 Değerlendirme)
5.3
subratawsk

Hi Geoff, Hope you are doing well. Thanks for the requirement. We have gone through your description and we are confident to deliver you best solution. Your Goal of the project and your requirement is very clear to Daha Fazla

$185 USD in 6 gün içinde
(16 Değerlendirme)
4.5
Climaxwares

Dear Employer ; our team is fully ready to dedicate their work on your project to finish on the mentioned time , we have been in this industry for 7 years and such jobs are our daily practice. This our first week on Daha Fazla

$45 USD in 2 gün içinde
(9 Değerlendirme)
4.4
hanzalaarqum

A proposal has not yet been provided

$50 USD in 3 gün içinde
(32 Değerlendirme)
4.4
reneetide

Hello Geoff I have read your project description and the function you require can be achieved using JQuery, I will be able to use JQuery to make the boxes cover the other boxes, please contact me and we can discuss thi Daha Fazla

$50 USD in 3 gün içinde
(7 Değerlendirme)
3.0
Nisshoku1980

I would be happy to assist you with your project. This should be able to be done with very light JavaScript and some CSS. This will likely not take much time at all.

1 gün içinde %bids___i_sum_sub_32%%project_currencyDetails_sign_sub_33% USD
(4 Değerlendirme)
2.3
AhmedWessam

Hello Sir , I have experience of 5 years in web design and development( I am just new to freelancer ) . i have viewed your website and it's fix is easy i can give the working code to you in less than one hour as Daha Fazla

$35 USD in 0 gün içinde
(3 Değerlendirme)
2.2
ingdavidm99

- Ordenar html para las cajas - Mejorar javascript para el calculo de tamaños de las cajas - Organizar css - Pruebas

$77 USD in 3 gün içinde
(0 Değerlendirme)
0.0
techweave

I can't promise how it will be written, but if it can be done, I can do it and can start immediately. Please reply if you want to go further with me.

$155 USD in 3 gün içinde
(0 Değerlendirme)
0.0
mmunizsi01

Trying to build my reviews

$30 USD in 5 gün içinde
(0 Değerlendirme)
0.0
wndessy

A proposal has not yet been provided

$155 USD in 3 gün içinde
(0 Değerlendirme)
0.0