POP UP HTML TEMPLATE

Durum: Closed
Ödül: $250
Alınan Girdiler: 3
Kazanan: lgdelrosario

Winner

Yarışma Özeti

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!)

Aranan Beceriler

Winner

Benzer Yarışma İlan Et

İşveren Geribildirimi

“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.

Genel Açıklama Panosu

Yarışma Sahibi
- 10 yıl önce
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
- 10 yıl önce
15 mesaj daha görüntüle
1. Yarışma Sahibi
  - 10 yıl önce
  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
  - 10 yıl önce
2. pbalasa
  - 10 yıl önce
  Thank you very much, Steve!
  I am glad you had a great result and hope my design and ideas helped!
  
  Kindest regards,
  Peter
  - 10 yıl önce
Yarışma Sahibi
- 10 yıl önce
I think Igdelrosario's got it just 1 day to go..
- 10 yıl önce
1. lgdelrosario
  - 10 yıl önce
  please email me how to chat with you online, looking forward to work with you :)
  - 10 yıl önce
fathimak
- 10 yıl önce
http://amftechsolutions.com/tmp/
- 10 yıl önce
2 mesaj daha görüntüle
1. arvigenio
  - 10 yıl önce
  I will post later the thumbnail version of my creation thnx
  - 10 yıl önce
2. arvigenio
  - 10 yıl önce
  I also sent you a private message
  - 10 yıl önce
MagicalDesigner
- 10 yıl önce
Sir please sealed the contest.I want to submit my entry thanks
- 10 yıl önce
1. Yarışma Sahibi
  - 10 yıl önce
  The contest is now sealed.
  - 10 yıl önce
2. Yarışma Sahibi
  - 10 yıl önce
  You didn't submit so the contest has been unsealed
  - 10 yıl önce
fathimak
- 10 yıl önce
I will show demo tomorrow
- 10 yıl önce
Yarışma Sahibi
- 10 yıl önce
UPDATED BRIEF - CHECK IT OUT
- 10 yıl önce
SourceForge
- 10 yıl önce
hello, still in progress ?
- 10 yıl önce
1. Yarışma Sahibi
  - 10 yıl önce
  Yes still in progress.
  - 10 yıl önce
2. Yarışma Sahibi
  - 10 yıl önce
  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/
  - 10 yıl önce
Yarışma Sahibi
- 10 yıl önce
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.
- 10 yıl önce
quangtranvn
- 10 yıl önce
let me do it and you will not be disappointed, I have a lot experience make a webpage from a->z.
- 10 yıl önce
Yarışma Sahibi
- 10 yıl önce
Think old school - keep it simple and stupid
- 10 yıl önce