POP UP HTML TEMPLATE

Status: Closed
Prêmio: $250
Inscrições Recebidas: 3
Vencedor: lgdelrosario

Winner

Síntese do concurso

I currently have a template I have developed for an information section.
http://www.rawmats.com/info/Template1.php
I would like the current template to be polished up to make it as efficient and attractive as possible.
OBJECTIVE:
Template for the template page and the pop-up page
1) Hide template page, instead of just sending to bottom
2) W3 compliant, 3) fast loading, 4) attractive, 5) modern 6) minimalistic code 7) no Flash, only HTML, CSS, JS, PHP
8) Work on Chrome, Opera, Safari, Firefox and yes, sorry IE too! 9) Prefer imbeded CSS instead of a separate CSS file.
10) Maintain high text to code ratio http://99webtools.com/text-to-code-ratio.php
"function before form" Keeping it old school HTML as far as possible.

UPDATE:
Since starting the contest I have actively been looking around for a transition between pages myself and have decided I want to use this one WITH your styling:
http://www.rawmats.com/book/
Flip pages 2-3 I have used the pop-ups.
The original code is open-source from:
http://tympanus.net/codrops/2012/12/11/fullscreen-pageflip-layout/

1) Maybe the thumbnails should be in DIV tags not tables?
2) Bug - the screen does not scale down on a mobile well (the original Template1, 2, 3 etc worked OK for PC and mobiles)
3) Bug - If the Pop-Up is showing and the Left and Right Arrows on the keyboard are used then the book stops working after the PopUp is closed.
4) I want to get the pages to be exactly screen size preferably without scroll bars so its like a Kindle reader feel. I will do this by ensuring that the content is not too long - unless you have better solution. (NOT SQL DB!)

Habilidades Recomendadas

Winner

Lance um Concurso Como Este

Feedback do Empregador

“Really pleased with his work - has attention to detail and knows his stuff. Takes pride in his work. Maybe the best Freelancer I have ever worked with!”

perfumervw, Thailand.

Painel de Comentários

Proprietário do Concurso
- 9 anos atrás
Q.=> How many thumbnails per page?

Answer=> I'd like to keep the same page of thumbnails for every size of screen but just a smaller version for mobiles.

The standard number of thumbnails/page will be 24 (6 x 4) but I plan to have a 12 (4 x 3) and 6 (3 x 2) - THIS DEPENDS ON CONTENT NOT SCREEN SIZE

So the first example http://rawmats.com/info when you open it on a laptop or an iPhone (landscape) its the same look but just a smaller version (i.e. NOT less of bigger thumbnails).

The pop-up likewise is full screen on a laptop or iPhone (landscape)

As far as possible I would like to avoid scroll bars.

The 'feel' is to be there is a fixed screen like a touch screen TV that you can open the thumbnails. So content will have to be limited by ME to not spill over the screen size. If the user needs to see closer they have to zoom in themselves
- 9 anos atrás
Ver mais 15 mensagens
1. Proprietário do Concurso
  - 9 anos atrás
  Hi
  Many thanks for your entry - I thought you were sure to win it - but c'est la vie.
  You have great styling and if you are OK I will invite you to offer for any future contests/projects I put up.
  All the best,
  Steve
  - 9 anos atrás
2. pbalasa
  - 9 anos atrás
  Thank you very much, Steve!
  I am glad you had a great result and hope my design and ideas helped!
  
  Kindest regards,
  Peter
  - 9 anos atrás
Proprietário do Concurso
- 9 anos atrás
I think Igdelrosario's got it just 1 day to go..
- 9 anos atrás
1. lgdelrosario
  - 9 anos atrás
  please email me how to chat with you online, looking forward to work with you :)
  - 9 anos atrás
fathimak
- 9 anos atrás
http://amftechsolutions.com/tmp/
- 9 anos atrás
Ver mais 2 mensagens
1. arvigenio
  - 9 anos atrás
  I will post later the thumbnail version of my creation thnx
  - 9 anos atrás
2. arvigenio
  - 9 anos atrás
  I also sent you a private message
  - 9 anos atrás
MagicalDesigner
- 9 anos atrás
Sir please sealed the contest.I want to submit my entry thanks
- 9 anos atrás
1. Proprietário do Concurso
  - 9 anos atrás
  The contest is now sealed.
  - 9 anos atrás
2. Proprietário do Concurso
  - 9 anos atrás
  You didn't submit so the contest has been unsealed
  - 9 anos atrás
fathimak
- 9 anos atrás
I will show demo tomorrow
- 9 anos atrás
Proprietário do Concurso
- 9 anos atrás
UPDATED BRIEF - CHECK IT OUT
- 9 anos atrás
SourceForge
- 9 anos atrás
hello, still in progress ?
- 9 anos atrás
1. Proprietário do Concurso
  - 9 anos atrás
  Yes still in progress.
  - 9 anos atrás
2. Proprietário do Concurso
  - 9 anos atrás
  Update:
  I have actively been looking around for a transition between pages and have found this one:
  http://www.rawmats.com/book/
  Do you think that the templates could be put onto this page and when a thumbnail is clicked it opens the popup?
  Click on popup > back to book
  The code is at:
  http://tympanus.net/codrops/2012/12/11/fullscreen-pageflip-layout/
  - 9 anos atrás
Proprietário do Concurso
- 9 anos atrás
FYI: I currently like the general way my original template works.
Equal thumbnails - full screen pop-up page - looks same cross-browser. Even works pretty much the same on a mobile device.
However:
I am looking for just a less clunky transition from template to template (maybe slide, fade or hopefully you have a better idea) or a more interesting opening/closing on the pop-up (transition, expanding, fading or...??).
But it must feel to the user:
Quick, modern, simple, minimalist, attractive interface, wanting to click more....
Maybe:
No scroll-bars. Full screen without menu bars as default. Consider transition effects as long as they are just CSS, JS, HTML, PHP. Absolutely NO FLASH.
- 9 anos atrás
quangtranvn
- 9 anos atrás
let me do it and you will not be disappointed, I have a lot experience make a webpage from a->z.
- 9 anos atrás
Proprietário do Concurso
- 9 anos atrás
Think old school - keep it simple and stupid
- 9 anos atrás