Tweet
In the past I've published a post about developing a progress bar/indicator for ASP pages. In that article we used a small rounded gif to make the user aware of the fact that something is going on and information is gathered.
Today, for your joy, I want to share my collection of animated gifs that can be used as progress bar. Some are simple, some are a little bit bizarre and some are a little bit intrusive.
You can choose the one you prefer, and use it on your pages. I believe they all are copyright free, but if you recognized your copyrighted work here, just drop a line and I will give credit to you or remove it, if you prefer.
Here we go... the great progress bar parade! (this post is some kind of a joke or not?)
Web development, web design and programming.
Wednesday, 16 May 2012
Monday, 14 May 2012
JavaScript: set image height according to viewport
Tweet
I've recently had to deal with a strange situation in a web project. I basically had an image in the home page which filled roughly the 60 percent of the viewport. The image was responsive and it was adapting to the browser window size. The problem was: the image was resizing following its width and it was not shrinking after a certain point. The result was that when viewed with a 16:9 monitor, the image was somehow too tall to fit the screen and the annoying vertical scrollbar made its appearance (which was meant, for the rest of the pages needed it).
Solution? Well, I decide to use JavaScript and specifically window.innerHeight in order to control the image height according to the viewport.
Before getting into the actual code, I need to explain some things, so bear with me and be patient.
I've recently had to deal with a strange situation in a web project. I basically had an image in the home page which filled roughly the 60 percent of the viewport. The image was responsive and it was adapting to the browser window size. The problem was: the image was resizing following its width and it was not shrinking after a certain point. The result was that when viewed with a 16:9 monitor, the image was somehow too tall to fit the screen and the annoying vertical scrollbar made its appearance (which was meant, for the rest of the pages needed it).
Solution? Well, I decide to use JavaScript and specifically window.innerHeight in order to control the image height according to the viewport.
Before getting into the actual code, I need to explain some things, so bear with me and be patient.
Friday, 11 May 2012
Blogger: prevent new country-specific URLs
Tweet
As you may have noticed, the people of Blogger have decided to implement a new URL system. Basically, the blog URL is changing to a country specific domain based on the origin of the browser request.
To simplify it, if you visit the web thought from the UK, the original blog URL (which is thewebthought.blogspot.com) will be changed to thewebthought.blogspot.co.uk.
And that is happening for each country.
As a result, the new country specific URLs have, among others, a great impact on blogs traffic statistics. However there's a solution which is quite simple and which I explain in the following post.
As you may have noticed, the people of Blogger have decided to implement a new URL system. Basically, the blog URL is changing to a country specific domain based on the origin of the browser request.
To simplify it, if you visit the web thought from the UK, the original blog URL (which is thewebthought.blogspot.com) will be changed to thewebthought.blogspot.co.uk.
And that is happening for each country.
As a result, the new country specific URLs have, among others, a great impact on blogs traffic statistics. However there's a solution which is quite simple and which I explain in the following post.
Wednesday, 9 May 2012
CSS: create boxes with arrows
Tweet
Today, in this short post, I would like to show you how to easily create something like the following box:
The Web Thought
Isn't it great? We can obtain it with just CSS and a simple div.
There's a good tool that can create all the needed CSS and all you have to do is create the div with a class="arrow_box" and see the result.
Please visit CSS arrow please and see the magic.
Short post for busy days... see you next time.
Today, in this short post, I would like to show you how to easily create something like the following box:
The Web Thought
Isn't it great? We can obtain it with just CSS and a simple div.
There's a good tool that can create all the needed CSS and all you have to do is create the div with a class="arrow_box" and see the result.
Please visit CSS arrow please and see the magic.
Short post for busy days... see you next time.
Monday, 7 May 2012
CSS: clip your image or a container
Tweet
Images are a important part of a web site. We know how to correctly place images, how to resize them, but how many of you know about clipping?
An image can be absolutely placed and clipped just to fit its container... with just a line of CSS.
An example?
Well, let's see the following image:
And now we try to clip it.
Can you see what's the effect?
How does it work?
Images are a important part of a web site. We know how to correctly place images, how to resize them, but how many of you know about clipping?
An image can be absolutely placed and clipped just to fit its container... with just a line of CSS.
An example?
Well, let's see the following image:
And now we try to clip it.
Can you see what's the effect?
How does it work?
Friday, 4 May 2012
ASP: avoid SQL injections
Tweet
If you work a lot with ASP and SQL, you might already know about SQL injections.
It's quite clear that every time we offer a visitor the possibility of filling a form (whatever its purpose may be), there's a security risk for our database. Basically, an attacker can insert some code in a form element, which will serve as a breach, allowing access to data stored in the database.
How that's done is not the main topic of this short post, however we should be aware of the fact that those threats are often used to update, delete and insert data, or in worst cases, they are used in order to gain access to reserved areas of a web site.
In this article, we are going to create a small VBScript function to avoid SQL injections.
If you work a lot with ASP and SQL, you might already know about SQL injections.
It's quite clear that every time we offer a visitor the possibility of filling a form (whatever its purpose may be), there's a security risk for our database. Basically, an attacker can insert some code in a form element, which will serve as a breach, allowing access to data stored in the database.
How that's done is not the main topic of this short post, however we should be aware of the fact that those threats are often used to update, delete and insert data, or in worst cases, they are used in order to gain access to reserved areas of a web site.
In this article, we are going to create a small VBScript function to avoid SQL injections.
Wednesday, 2 May 2012
JavaScript: asynchronous loading
Tweet
JavaScript is an important part of web developing. We heavily rely on JavaScript library and more than often we use external reference to load js snippets. In order to link an external js file we usually insert the following code where needed:
There's a solution to the above issue: using asynchronous loading and here I show you how to use it.
JavaScript is an important part of web developing. We heavily rely on JavaScript library and more than often we use external reference to load js snippets. In order to link an external js file we usually insert the following code where needed:
<script src="http://externalDomain.com/script.js"></script>
If the externalDomain is someway busy or down, our page will hang, waiting for the externalDomain. The page will eventually be loaded and displayed when the resource becomes free. Worst case scenario: the externalDomain stays busy and our page stays completely blank.There's a solution to the above issue: using asynchronous loading and here I show you how to use it.
Subscribe to:
Posts (Atom)