Hi im making my website at the moment and i was wondering if there was a way to show loading screen before the whole web page appears using html is it possible?
I don't think there is a way to do it with with HTML only. However, it would be really simple to just use an animated .gif and the onload event in JavaScript.
Related
I'm trying to make a lightweight website using no (or just a little) of JavaScript. So just HTML and CSS.
I'm working on a page where I'm summarizing images and when we click on that image it scrolls to the end of the summary where I display every image on large scale and explain what it's about.
So everything is working with a href to an anchor but the problem is that since I want to make the website as light as possible, I'm using loading=lazy on my images but the href anchor trigger every loading on the way...
Is there a way to use both href anchor and lazy loading without JavaScript (or in a lightweight version)?
I found out that scroll-behavior: smooth; in css trigger the loading of every image on the way
So if I don't that use that transition I don't have to put JS on that page !
But if it's something you really want, you can hide divs with large images and write a simple function to display it when you click on the thumb.
I am trying to create a web page similar to my prototype design (https://xd.adobe.com/spec/79bbc862-6b2f-4f46-4c27-c5847918f854-0f8a/screen/8e80c8c1-a016-4e2c-8e11-557ebdf778b5/success-17)
i have made the page with all the text and everything jus stuck on the loader part
You want to use javascript/jquery for this. A simple method would be
$('#text').delay(3000).fadeIn(2200);});
but you can play around with the delay and the fade
Im pretty new to html5, im learning at school.
I have a credits button (image) and what i want is when i click on the credits picture. a video should overlay everything thats on the Website.
I thought about redirect to another page with that Video on it. But i want it to happen flawless. Maybe with something like Video.
Someone has an idea?
I think this is going to be pretty hard to make in HTML only.
What you are trying to make is called 'Lightbox', if you have a little bit of Javascript knowledge you can try using this jQuery plugin. it's pretty simple to use and it has support for Video.
Ok, so im creating a website and to make it look fancier, I need to make the image responsive to the mouse (i.e. when the cursor is over the image, when the image is click, etc.) Does anyone know the code or another way of doing it? I am using google sites. Thanks!
I would recommend using JQuery to select and add some actions to your images have a look at this tutorial it is quite good.
You can take the idea and change it to your liking.
I am designing a web page for mobile devices. I know jquery is awesome but I dont want to use it. I want to achieve smooth page transitions like this http://jquerymobile.com/demos/1.0a4.1/ but without using jquery. How can I achieve that? There are web service being called between page transtitions, hence there will be delay. I want it to be as smooth as possible.
Face it: You're going to have to use JavaScript, and it'll be very tedious without using some framework or other. To get smooth page transitions, you have two options:
1) Run the site as a single page. That is what is used in the site you link to. The whole thing has no page transitions; it's all one page with some click events used to animate the content and load it dynamically with AJAH.
2) Run a multi page site, but using local storage. You would have a small number of pages, and cache the resources needed for them. The JavaScript would run instantly when the page was loaded, and draw a nice load screen while the ordinary content was loaded and displayed by AJAX.
Personally, I wouldn't be too concerned about page transitions; it's just how websites work. Don't be put off by jQuery either, because by the time you've written all this JavaScript you will be wanting it. Even for mobile sites, the size of the library is just about acceptably small (you can use a CDN-cached copy).