I have been battling long time to create a full screen website. After experimenting and researching looks like using JQuery is the best way to design one.
Just to make sure. Is using JQuery really the best way?
If so is there any tutorials I can base my website? (I have been searching on Google but I can't find any good tutorials)
Finally this tutorial for full screen website created using jQuery, as the user scrolls the web address changes. Many other websites has the same looks but the web address does not change. What are the pros and cons? (I don't want my website to do that...)
CSS is use for layout.
I think you are referring to CSS for layout for design?
OK... I am spiraling down... More and more I research and learn it seems more difficult...
Please explain in detail how to create a full screen website... (I have been trying to create one only using HTML and CSS but it does not seem very practical)
If it seems difficult, that's because it is difficult (well, at least to do it right).
Then add CSS to get it to look OK (would be a longer page that could be scrolled) - then validate
After you get that working it would be fairly easy to add more content divs
Do have any development files you're working on so far?
You really need to clarify what you actually want to do. What kind of content does the site really need to present and in what way? Why are you so attached to this idea, which will probably be more confusing for users and introduce unnecessary accessibility issues? Make sure you have reasoned answers to questions like this. Users don't care how cool your site looks. Indeed, what seems cool to you is probably an annoyance to them, as it usually makes information harder to access—which is the reason they've come to your site.
Sorry I should have been more clear.
I am building the website to just have fun and learn and maybe use it as a public portfolio in the long distant future...
Basically I don't expect people to visit. Haha
I made a basic 2 minutes mock up:
So, this is the basic full screen website I want to create. I will be refining the information (I just copied from wiki for now) and formatting.
Each images (only two for now) will take full screen on: around 16:9 desktop screens.
First question for you. How would you want to display the images on monitors with wider resolution? White space on the sides?
If I understand what you want correctly you should only need to set the page background as fixed using your images in CSS and have the content within it scrollable?
No, no white spaces. It has to be full screen meaning the image must take all the space on common widescreen screens with widescreen ratios.
Do you mean: I merge those two images into one image file and make the browsers to load one whole image?
If so that would increase the loading speed significantly...
This might help you understand my design. (Treat each image as a slide)
(But this way the browser is constantly requesting different webpage files. I don't think this is a good idea)
I think I have set the goals to high but I seem to be getting somewhere!
There are no additional page requests. It's simply a fragment identifier for an in page link.
<a href="#firstPage">First slide</a>
That normally just sends you to an id in that same page of firstPage. No additional page loads are required. The author is using that method so that the back button takes you back to the previous slide as you would if they were separate pages. In the documentation there are examples without using anchors.
This topic is now closed. New replies are no longer allowed.