Announcement:

  Hello, We Are Now Designing Blogger Awesome Template. Check Out At Netzspot.Blogspot.
Showing posts with label HTML-CSS-PHP-JavaScript. Show all posts
Showing posts with label HTML-CSS-PHP-JavaScript. Show all posts

Monday, February 10, 2014

How To Add Start A New Line Or LineBreak In HTML TITLE TAG?

How To Add Start A New Line Or LineBreak In HTML TITLE TAG?

Many guys want to add different text in there title tag that they used in there codes so they use many codes like <br />, {ENTER} that actually didn't work and some Of them also use JavaScript or JQuery that can make there blog loading time hight that is also against SEO. So here I am with a short and perfect code that will add a new line in your title tag or can start a new line in your title tag or can add line break to it.
Read More ...

Sunday, January 5, 2014

How To Change CSS Class Of Multiple DIV Having Same Classes?

How To Change CSS Class Of Multiple DIV Having Same Classes?

Many codes including me was looking for it. This type of code is also availeable on google widley but they arenot like this. This one have some extra features. Its sound to be simple but its not only in working and very simple in coding. The main work of this code is first to pick the desired classes from all the webpage through CSS CLASS not CSS ID that many do, The next step is to convert all of these classes with one click to other classes. So via this you can change full style of a div using its class.

It actually run a loop by finding the same class from a webpage that is not required if we pick the DIVs from there ID but sometime we only have CLASS. One more thing is that you can also switch between two classes or a div using the same code and also some more taht you can get via contacting us. So now check out the live DEMO and see the features of the code and get it from below. Its quite easy to understand and use it.
Read More ...

Thursday, September 26, 2013

ViewPort Height/Width CSS Code: Set You DIV Size As Visitors Screen

ViewPort Height/Width CSS Code:

There are a couple of relatively new CSS measurement units called Viewport Percentage Lengths. The viewport-percentage lengths are relative to the size of the initial containing block. When the height or width of the initial containing block is changed, they are scaled accordingly.

These units are vh, vw, vmin and vmax. For this question, we can make use of vh (viewport height): 1vh is equal to 1% of the viewport height. That is to say, 100vh is equal to the height of the browser window, regardless of where the element is situated in the DOM tree...

Features:

1.) Its Pure CSS.
2.) Supported By Major Browsers.
3.) Easy To Use.
4.) Will Fetch According To User Screen Size.
5.) Used In Maximum No Of CSS Codes.
Read More ...

Saturday, August 17, 2013

How To Open Two Link At A Time On A Single Click?

How To Open Two Link At A Time On A Single Click?

A reader asked if she can make a navigation tab open more than one link when clicked. The answer is YES it can be done, with the help from a small Javascript. Occasionally we got such a situation that we need multiple links to be opened together. Say, you are an owner or author of a blog or website that supply different types of download e.g. movies, themes, software, wallpapers etc, your web page must contain a clickable link. You might like to add more than one link to be opened when visitor click on the link so that you can earn more (by affiliate/ linkbucks/adfly) or increase page views etc. In that case you can do this stuff with simple script. We need a little modification instead of our regular html code to make open more than one link when visitor's click.
Read More ...

Wednesday, July 10, 2013

How To Stretch A Font/Text Horizontally And Vertically With CSS?

How To Stretch A Font/Text Horizontally And Vertically With CSS?

Some days ago I was designing a template. I liked a font that is long in it's vertical length. I added it to my template and then it start looking good. Then when it comes for SEO, I checked it on PageLoading time then it was too high that is totally against SEO. So I start checking again what the real problem and i got it on WebFont. So I have to remove it but I also liked it. In the new era SEO is on top beyond the designing so I removed that font. Then here came an idea about converting a WebSafeFont into that stylish new font. I got the 99% matching WebSafeFont but 1% difference came on font vertical length. Then it's time to remove that 1% difference also.
Read More ...

How To Add Rainbow Animation Into Header Logo Or Text?

How To Add Rainbow Animation Into Header Logo Or Text?

Hi visitors!! Now days CSS3 has become very popular and it gives a nice and stylish touch to your blog. It is totally different and easy to handle then jquery , but it gives similar results as comparison of it. Its very light and easy to install, So today we have came up with a kind of trick which is supported by css3, after applying this trick your header logo will perform a rainbow effect when a visitor will hover over your blog’s logo or header, the tricks contains simple but effective coding so it will not affect your page speed, Let’s see the demo first.
Read More ...

Friday, June 14, 2013

Stylish JavaScript Testimonials Slider For Blog And Website

Stylish JavaScript Testimonials Slider For Blog And Website

After My Previous Post J-Query Text Slider Without Navigation.Many People Send Me Request To Share A Testimonial Slider Without JQuery Because It Will Increase There Loading Time, So Here I Am Again With The New And Only JavaScript Code.As many people want Testimonial slider for there website and blog to show there visitor that they have good response from there Great User. For this purpose they want text box but if they have more then one testimonial there is a big problem to them how to manage them all without wasting extra space from there site and blog.So i am here with a new article and a awesome JavaScript so that you can user this on your site or blog, it is easy to install and quick to load with navigation menu so that visitor can see how many testimonial you have.
Read More ...

Thursday, June 6, 2013

Simple And Pure HTML SlideShow With Play/Pause Controls

Simple And Pure HTML SlideShow With Play/Pause Controls

After our laste article about Simple And Pure HTML Image Slider Without CSS Or JavaScript Here we have new, simple and stylish HTML image slideshow with Play/Pause controls widget for blog and website based upon pure HTML code even without <style>, <script> Or $ Codes Or Files to make your web more stylish then it is. As you know that every blogger and f web designer wants a slider to show his main creation in a nice way  and for this he add some cool sliders in that he add his top products and put it at the top of his webpage to be notified first by visitor. For these slider he add some JavaScript and jquires that make his slider awesome but also make his blog load time soo heavy from that his visitor and Google (SEO) both got hurt because nobody have such a huge time as jquery needs.
Read More ...

Wednesday, May 29, 2013

Simple And Pure HTML Image Slider Without CSS Or JavaScript

Simple And Pure HTML Image Slider Without CSS Or JavaScript

Here we have new, simple and stylish HTML image slider widget for blog and website based upon pure HTML code even without <style>, <script> Or $ Codes Or Files to make your web more stylish then it is. As you know that every blogger and f web designer wants a slider to show his main creation in a nice way  and for this he add some cool sliders in that he add his top products and put it at the top of his webpage to be notified first by visitor. For these slider he add some JavaScript and jquires that make his slider awesome but also make his blog load time soo heavy from that his visitor and Google (SEO) both got hurt because nobody have such a huge time as jquery needs.
Read More ...

Monday, May 6, 2013

How To Customize Title Tag Of A Link Through CSS-JavaScript?

Customize Title Tag Of A Link Through CSS-JavaScript

Before proceeding further first we have to learn that What Is Title Tag And Why They Are Important. When you're trying to create effective page content that will appeal to both human visitors and search engine spiders, you need to get the most out of every page element. One way to do this is to use ALT TAG for SEO and TITLE TAG for Visitor . They increase your site's usability level and promotion possibilities if you clearly understand where to put them, when to use them, and why.

What Is ALT Tag:-

The ALT attribute is designed to be an alternative text description for images. ALT text displays before the image is loaded (if it's loaded at all) in the major browsers and instead of the image in text-based browsers. ALT is a required element for images and can only be used for image tags because its specific purpose is to describe images.

What Is TITLE Tag:-

The Title attribute is designed to be a description for images and links that if a visitor want to open a link, they should be known of what they are going to open through hover description.

***BUT***

There is a problem that in default title tag you can not edit it or customize it like if you want to see a breif description of link like heading and paragraph with tables and image, That is something that can attract your visitor,Don't be afraid it's so easy. I am going to show how you can do it as you have seen in the above screen shoot.Just have a look on live demo throught the given link.
Read More ...

Sunday, May 5, 2013

Marquee: A Best HTML Tag For Moving Your Object.

Marquee: A Best HTML Tag For Moving Your Object.

What Is A Marquee?

The marquee tag is a non-standard HTML element which causes text to scroll up, down, left or right automatically. The tag was first introduced in early versions of Microsoft's Internet Explorer, and was compared to Netscape's blink element, as a proprietary non-standard extension to the HTML standard with usability problems. In simple The HTML <marquee> tag is used for scrolling piece of text or image displayed either horizontally across or vertically down your web site page depending on the settings.
Read More ...

Sunday, April 28, 2013

How To Show Different Image On Hover Using HTML Code?

How To Show Different Image On Hover Using HTML Code?

Today The Topic Is That "How To Show Different Image On Mouse Over Or Hover On A Static Image Using Pure HTML Code And Even Without CSS Code With Also A URL Link Placed On Both Of Them?". we all know that a rollover or mouse over image is a great image effect you will have seen used on lots of blogs and websites.When you use this effect with an image or Picture you add to your blog the image will change to differant image once you hover your cursor over it.It's also a very easy to use and can have so many uses. Here's a preview of a rollover image, Place your cursor over the image to see it change. The image is also a clickable link so you can use it as a link on your blog. Making Rollover Effect Image This is the code we use to make the image.
Read More ...

Wednesday, April 24, 2013

Simple Float DIV Stick To Top After Scroll With Changing It's CSS

Simple Float DIV Stick To Top After Scroll With Changing It's CSS

There are times when you would want to display a bar at the top of the page when user scrolls on the page and it should go back to its original position when the user scrolls back up. This is particularly useful when you want to add say a share bar, a search bar, etc and make it always visible even when the user is at the bottom of the page.
Read More ...

Saturday, April 13, 2013

How To Change CSS .class Of A DIV On Mouse Hover?

How To Change CSS .class Of A DIV On Hover?

ToDay The Question Is That How To Change CSS .class Of A DIV On Mouse Over Or Hover Using DOM Effect Without JavaScript Or J-Query? The Ans Is Simpley Given Below. This Is Also Questioned By Many Friends So I Am Here Again, If You Have To CSS .class And Want To Change On Movse Hove r Then It Will Automatically Pick Up Second .class CSS Code And Start Displaying But On Again Mouse Out, It Will Be Back On The First .class And Start Displaying It. This Is Best For Idealogical Designer Or Can Be Used For New Style Gadget And Widget. You Have Full Right To Change The .class SIZE, COLORS, Fonts, Padding, POSITION And etc. It's Pure DOM Effect Not Within The <script> Tag Or Even $document Tag... So If You Want It, Just Add It Now With Easy Setps.

Read More ...

Friday, April 12, 2013

Awesome Success, Warning, Notice, And Error DIVs Codes

Awesome Success, Warning, Notice, And Error DIVs Codes

After viewing on many sites that are showing there message in a related box as the message wants to be displayed, I also want to do something like this, I started searching Google by i could not found any best with full tuotoria so I started myself. It seems easy to code but the reason is that you must have to short your code and remain mind others templates code as you did not know what type of template other have, so you have to design a cross template and cross browser code to be OK. So I designed a simple code that even didn't have tag because i embed the style in one div so now it is easy to use and install with out touching any other codes.
Read More ...

Monday, April 1, 2013

How To Open/Show Close/Hide DIV After Some Desired Time?

How To Open/Show Close/Hide DIV After Some Desired Time?

Today after many previous post like "How To Open DIV On Click" or "How To Close DIV On Click", I am here to show an awesome code that is "How To Open/Close DIV OnClick/OnLoad After Some Desired Time". This is absolutly an awesome code and I think that you must need it if you are providing data on your sites or links to them. First of all I describe this code in front of you.
Read More ...

Friday, March 29, 2013

How To Add Link To SWF Or Flash File To Open A href="www" URL?

How To Add Link To SWF Or Flash File To Open A href="www" URL?

SWF is an Adobe Flash file format used for multimedia, vector graphics and ActionScript. Originating with FutureWave Software, then transferred toMacromedia, and then coming under the control of Adobe, SWF files can contain animations or applets of varying degrees of interactivity and function. Currently, SWF is the dominant format for displaying "animated" vector graphics on theWeb.It may also be used for programs, commonly browser games, using ActionScript.You have also read some tutorial about this, some tells you with Java-Script and some make you fool by telling you long code, Here i will do nothing like this with you so directly coming to the point we discuss, How To Do It In Easy Way? and also tell you how to add in blog and website.
Read More ...

Tuesday, March 26, 2013

How To Open A DIV Content/Data Into A POPUP Window?

How To Open A DIV Content/Data Into A POPUP Window?

ToDay The Question Is "How To Open A DIV Content Or Data Into A New Browser POPUP Window With Close And Print Option To Make It Easy For Your Visitors With JavaScript Code".
Some of my friends were asking about something like it so i am here again to fullfill there desire, This is a special and simple popup window shoer code that will get your DIV data and automatically creat a popup at that time and make it visible to the viewer, This is also used for removing formats like if you have style up you DIV with extra css and you allow visitor to copy the code from that DIV, When the user copy your code or data, There will automatically CSS will be copied on his clipbord, But through this all formats will be removed and only simple text with better vision will be displayed in new popup window that will make your user also happ to be easy.
Read More ...

Monday, March 18, 2013

"Two Try Download Button" Like MediaFire Without J-Query

"Two Try Download Button" Like MediaFire Without J-Query

Hi, I am again here with a new awesome and stylish code that also did not have j-query or {script} tag as according to may law to make it quick to load and make your webpage lite. It is actually based upon my previous article about How To Change DIV Content/Data On Mouse Click?, Now after some up-gradation  The code is fully changes and become new after giving him some time.
Read More ...

Saturday, March 16, 2013

How To Open/Show And Close/Hide DIV With CSS Code?

How To Open/Show And Close/Hide DIV With CSS Code?

Many time ago i am also searching for "How To Open Or Show A Hidden DIV And Close Or Hide An Open DIV With Pure HTML-CSS-DOM Code Without JavaScript Or J-Query Code In Quick Way With Short Code?" but everywhere i got the JavaScript code to open or show and close or hide a div id. But my target is to get only CSS code because i did not want to make my page heavy using even a single line JavaScript. So i start creating Ideas and finally i got the code which seems very easy but it was difficult to generate, However i do this and I am glad to share it with you so that you can also take the Benefits from it and make your page quick to load. There are two codes below, First is to close a div in which you will get the code through which you can close a div and in Second code you will receive that code which will help you to open a hidden div.
Read More ...