Big Tree Blog

Quick and Easy Super-Customizable Tabbed Content in JavaScript and CSS

Rameez Virji — Thu, 15 Mar 2012 21:50:06 +0000

Requirements: HTML (basic understanding), JavaScript (basic understanding), CSS (basic understanding)

As a web designer, I’ve found many uses for tabbed content. However, all the online tutorials are all referencing external JavaScript files, or images, or you can’t play around with the layout without screwing up your entire page layout, or ARRRRGH I hate them!

So I devised an incredibly simple and versatile method to build a simple tabbed layout. You can customize it in any way you want, add or remove pages, change sizes, do whatever you want with it! You can make your “buttons” go anywhere on the page, same as your content. Granted, the coding is quite messy, but the end user isn’t generally going to be looking at the code anyways, so no big deal!

Here’s the demo, if you want to see what it looks like.

There’s three parts to this method: the JavaScript, the CSS, and the HTML. Let’s go step by step.

Step One: Setting up the basic CSS

The CSS for this is incredibly basic:

Insert the following between your and tags, or into your stylesheet:

As you can see, you can style the tab buttons with .tabbtns and style the tab content boxes with .tabctnt! It’s easy!

Step Two: Setting up the JavaScript

This is the messy part. Basically, what the script does is it sets the z-index of the tab content to 5 and the rest to 0 when you click on the button.

Insert the following code in between your and tags, or in an external JavaScript file:

You can change the colors around to suit your design.

Step Three: The HTML itself!

The HTML is also very basic. Each button is a div which can be placed wherever and however you want. Just remember to include the id “tabbtn1″ or “tabbtn2″ etc. on the button.

Enter this where you want your buttons.

Tab 1
Tab 2
Tab 3

If you want them to be horizontal tabs, place “display:inline;” in the “.tabbtns” class in the CSS.

Then, place this where you want your tabcontent to go:


Tab 1



Tab 2



Tab 3

Step Four: Customisation

Adding another tab:

To add another tab, do the following:

In the HTML, add this to the tab buttons:

Tab 4

and this to the tab content:


Tab 4

Now here’s the kinda tricky part. In the Javascript, add the following into each function.

After “document.getElementById(“tabbtn3″).style.color=”#ffffff”;”, add:

document.getElementById("tabbtn4").style.backgroundColor="#ffffff";

document.getElementById("tabbtn4").style.color="#000000";

After “document.getElementById(“tabco3″).style.zIndex=”0″;”, add:

document.getElementById("tabco4").style.zIndex="0";

And after “document.getElementById(“tabco3″).style.visibility=”collapse”;”, add:

document.getElementById("tabco4").style.visibility="collapse";

Then, copy and paste the tb3 function and rename it tb4, and then switch the values so that all the Tab 4 content has the active properties, like so:

function tb4() {
document.getElementById("tabbtn1").style.backgroundColor="white";
document.getElementById("tabbtn1").style.color="#6594a4";
document.getElementById("tabbtn2").style.backgroundColor="white";
document.getElementById("tabbtn2").style.color="#6594a4";
document.getElementById("tabbtn3").style.backgroundColor="white";
document.getElementById("tabbtn3").style.color="#6594a4";
document.getElementById("tabbtn4").style.backgroundColor="#e6f3f8";
document.getElementById("tabbtn4").style.color="#000000";
document.getElementById("tabco1").style.zIndex="0";
document.getElementById("tabco2").style.zIndex="0";
document.getElementById("tabco3").style.zIndex="0";
document.getElementById("tabco4").style.zIndex="5";
document.getElementById("tabco1").style.visibility="collapse";
document.getElementById("tabco2").style.visibility="collapse";
document.getElementById("tabco3").style.visibility="collapse";
document.getElementById("tabco4").style.visibility="visible";
}

Making it look pretty:

To change the colours, edit the CSS properties of .tabctnt and .tabbtns. It’s pretty straight forward, and can be customized to nearly anything. Just don’t play around with the display, overflow, or float properties, or the z-index.

If you want to apply different styles to each of tab contents, either create a .tabctnt2 and style it the same, or nest a new div inside your tab page’s .tabctnt div which you style seperately. I recommend the former so that you can fully customize it easily with JavaScript, but it is more work that way.

So that’s it! It’s extremely simple, and a little bit messy, but it gets the job done properly without screwing with your layout or requiring external files!

The Clash of Ignorance, the Unstable Political Situations, and the Loss of Culture

Rameez Virji — Tue, 10 May 2011 01:24:14 +0000

In the recent years, the world has seen an unfortunate increase in conflict between the East and the West. After the horrific events on September 11^th, 2001, the magnitude of the international strife has increased profoundly. Regrettably, this conflict has multiplied, rendering the global situation direr as the years pass. These conflicts occur due to a combination of factors, which, if remedied, can affect the future in significantly positive way. This is important because these conflicts have already led to millions of deaths and a negative image of both sides in the other’s eyes. The negative image has led to prejudice, anger, and irrational behaviour on the global scale, including acts of terrorism and violence. As the world moves further into a globalized and pluralistic state, the importance of reducing these conflicts becomes more paramount than ever. In order to secure a bright, globally cooperative future, it is necessary to take measure which can alleviate some of the strains which cause conflict.

In an interview with Peter Mansbridge, the Canadian Broadcasting Corporation’s chief correspondent, the philanthropist and spiritual leader known as the Aga Khan IV mentioned a “clash of ignorance” which he believed was the root of the conflict between the eastern and western worlds. He elaborated to say that the lack of knowledge each culture had about the other was creating a divide between the two worlds which was creating problems on both sides. The primary reason for this partition is this “clash of ignorance”. A lack in the understanding of other cultures has led to a misunderstanding of the motives and desires of these cultures, and from that nations and fundamentalist groups have thought it necessary to take action. A textbook illustration of this concept is the invasion of Iraq. While justified, it initiated a chain of events which made reactionaries more committed and enraged. Baghdad is a particularly sacred city in the Islamic faith, and the conquest of it, the extremists believed, was a violation of their religious past. If there was more knowledge regarding the outlook of the inhabitants of Baghdad, conflict would be far less dominant. The only remedy to this is increased education and pluralism, especially in the citizens of the countries. For example, more education in the East about the true morals of the Western World would reveal to the East that the West values global cooperation, international goodwill, and future development. Likewise, more education about the East in the Western World would reveal that those cultures truly value the maintenance of peace, the honour of tradition, and the fostering of success. Augmented understanding of foreign cultures leads to acceptance, and acceptance leads to peaceful resolution.

Another reason for the escalation of conflict is the unstable political situation in many countries, especially in the East. Many regimes have started up which demand political control through violent means, in order to force drastic reverse change to previous times. Other dictatorships have emerged which use force and illegal devices to impose their ideologies on the population. Saddam Hussein’s regime was an effective example of this. As a corrupt leader, he tortured and gassed countless Iraqi citizens. When Hussein’s power was released, the existing discontent combined with the emerging extremist groups spawned a political instability. Hussein’s removal of power was necessary; however, there should have been a different approach to the situation. Saddam was already a corrupt power, and this had already created a situation of instability. An extremely unfortunate factor in this political instability problem is that is can often occur in a positive feedback loop. Corruption or instability causes more instability when it is removed, which in turn will destabilize the country further as the other powers are removed. The only way to solve these types of difficulties is to establish stable forms of government, which must be fair-minded, non-discriminatory, and incorrupt.

One other reason for the intensification of conflict is the phenomenon of global assimilation. Globalization has brought with it a great deal of positive influences, but it has also brought about an assimilation of culture. Many cultures have recently trended towards what many call the “western” culture, especially as the global use of technology increases. It is this loss of local and traditional culture which primarily spurs many reactionaries into wanting drastic change. Unfortunately, they attempt this through violent and dictatorial means. Extremist institutions such as Al-Qaeda and Hezbollah demand backwards change. They are displeased by the forfeiture of their preceding culture, and demand a return to the “good old days” when technology and western influence was minimal. An appropriate solution for this is to establish programs which encourage and assist the conservation of local culture. This can be brought about by establishing trusts for culture, stimulating local media to integrate the local practices, or running regular cultural festivals. Many such systems do currently exist, and magnificent headway has been made in this area. The Aga Khan Trust for Culture, for instance, is one institution which aims to preserve local culture while still maintaining global pluralism and trade.

These factors, among others, have had an enormous effect on the global scale. The “clash of ignorance” has created prejudice and knowledge-based barriers which cause misunderstanding of the other side in the East and the West. Simply educating citizens on the customs and beliefs of the other side can drastically reduce this difficulty. Education is the primary solution to solving the global conflicts, as it can eradicate many of the fundamental difficulties that lead to conflict. Many countries, particularly in the East, are in unstable political conditions, which are constantly spiralling downwards. Even when the corrupt government is eradicated, other unofficial and corrupt regimes often take over. Stable administration must be established in such circumstances. Global assimilation due to the effects of globalization has also majorly impacted the global situation, which has prompted extremists who disapprove of such assimilation into action. Local culture, therefore, should be conserved and maintained through trust programs, media stimulation, and active cultural practice. Altering and refining these aspects can allow for a vast improvement in the global situation, eliminating much of the conflict that is occurring. This will not only preclude many deaths, but will additionally eradicate much of the bigotry and preconception on both sides of the globe.

Williamizing: Episode 2 – The Historie of Robert the Sponge

Rameez Virji — Tue, 19 Oct 2010 00:26:00 +0000

Williamizing

By Rameez M Virji

THE HISTORIE OF ROBERT THE SPONGE

By William Shakespeare

ACT I

Scene i

A Portrait

Enter Pirate, Robert, and Children.

PIRATE: Be thou all prepar’d?

ALL: ‘Tis so, Lord.

PIRATE: Ottis Media! Repeat thou!

ALL: ‘Tis so, dear Lord, ‘tis so.

PIRATE: O! Who doth live in a

Exotic apple,

Live under Poseidon’s tomb?

ALL: It must be Robert the Sponge,

He who hath the quadrilateral trousers!

PIRATE: Indeed! To water he is all-engrossing,

Splattered with jaundice!

O, has he the holed bodice of a coral?

ALL: He does so, Robert the Sponge!

He who hath the angled pantaloons!

PIRATE: ‘Tis nonsense of the seas, which you wish?

ALL: True, ‘tis Robert the Sponge.

He who hath the square denims!

PIRATE: If that be true,

Then shalt thou all

Belly thyselves, flounder,

Like Pisces!

ALL: True, ‘tis Robert the Sponge.

He who hath the quadrangular pants!

PIRATE: Prepare thou for Robert the Sponge,

He who hath the tetragonal chinos! Ha!

Williamizing: Episode 1–The Comedie of the Freshe Prince of Belaire

Rameez Virji — Mon, 18 Oct 2010 03:39:00 +0000

I would like to take this opportunity to introduce a blogseries I am starting, called “Williamizing”. Basically, I will take popular stuff and turn it into a Shakespeare play. I’m stoked like a bonfire.

Williamizing

By Rameez M Virji

THE COMEDIE OF THE FRESHE PRINCE OF BELAIRE

By William Shakespeare

ACT I

Scene i

A Chair

Enter Willard, on Chair, accompanied by Lord, Duchess, and Torchbearers.

LORD: Sir, what be thy story?

WILLARD: I shall tell it now.

This is the histoire, telling of how

My life ’twas returned complete round.

‘Twas flipped.

LORD: Flipped, sir!

WILLARD: Thy tongue be still, friend.

I shall taketh but one minute of time.

Sit thee down, there.

I shall recount how I came to be Here

As the Prince of Belaire.

LORD: Do tell, sir!

WILLARD: ‘Twas in the Western Lands of Phil’delphe

Bourne, and so rais’d, was I.

In the ground where childfolk frolicke,

Was’t the very location where I spent a surplus

Of my days as a Man.

I was cool’d and maximizing and once again lax’d,

By my sword, cooly, to say.

And I was to be seen shooting the willyball

Upon the outskirts of my damn’d lycee.

LORD: Then, sir?

WILLARD: Silence, pray, I shall tell thee.

Upon that day, a duet of vagabonds,

Who, as I know, were up to some mischieving,

Had begun to wreak havoc upon my county.

LORD: ‘Tis untruthful, sir!

WILLARD: ‘Tis truthful, and truthfully so, dear lord.

Friend, speak not. ‘Tis my avenue to continue.

LORD: Apology! Apology!

WILLARD: Upon thy head!

Indeed, ’twas upon my head, I chanced quarrel.

‘Twas horrendous, I say.

Good Mother, Duchess, thou was’t there

That bloody Sunday.

What said thou?

DUCHESS: If I remember well, good son Willard,

I had imparted to thee a message,

Which, to my remembrance,

Plead thee to return to thy Uncle, the King,

And thy Aunt, the Queen,

In here these bright lands

Of Belaire.

WILLARD: Indeed. ‘Twas so.

I then called for transport,

And when it approached,

‘Twas my surprise!

The plate on reverse of the carriage,

Curiously, read Fresh, and upon the roof

Hung a pair of gamblers.

LORD: What sense in this…

WILLARD: If anything be said, say ’tisn’t common!

On the contrary, I had cried:

“Yea, Holmes! To Belaire!”

I pulled up to a castle,

Seven or eight seasons following,

And yell’d, to the rider:

“Yea, Holmes!

May our olfactoires meet once more!”

Look’d to my kingdom. At last, it had been,

I was to claim my trhone, as the Prince of Belaire,

And begin my reign.

Exeunt.

Hey there, Khalaila

Rameez Virji — Sun, 04 Jul 2010 21:16:00 +0000

EDIT: So apparently there’s already a “Hey there, Khalaila”… my bad! Didn’t mean to copy! Here it is

I’m at a camp called Shad Valley, and there’s this cool guy from Iraq named Yehyah. When another cool kid named Mark was playing Hey There Delilah by the Plain White Tees on his guitar, Yehyah devised these parody lyrics. No offense intended, only meant to be a joke. I’ve modified a few parts.

The whole point of this song is not to enforce stereotypes, but rather to ridicule them. The song was written to show the ridiculousness of the stereotype against the middle eastern countries. The point is, the stereotype is wrong.

Here’s the song:

Hey there Khalaila
What’s it like in Baghdad City?
I’m a thousand miles away
But habibi, you look so pretty
In your Hijab.
Suicide bombers can’t burn as bright as you
and damn those Jews.

Hey there Khalaila
Don’t you worry about the distance
I’ll call Osama if you get lonely
He’ll get me there so quickly
Close your eyes
Listen to my voice, it’s my disguise
Hummus is nice, but…

Oh the food here’s disgusting
Oh, the food here’s disgusting
Oh, the food here’s disgusting
Oh, the food here’s disgusting
So damn disgusting…

Hey there Khalaila
I know times are getting hard
But just believe me,
Habibi, I just need a few more hours
Until the time,
The bomb will go off killing those slime,
Victory will be mine.

Hey there Khalaila
I’m only here another day
As soon as the IED goes off,
I’m taking the next plane
Back to Iraq.
These damn Americans just suck,
They eat duck, but

Oh they burn kabobs, my dear
Oh they burn kabobs, my dear
Oh they burn kabobs, my dear
Oh they burn kabobs, my dear

A thousand miles seems pretty far
But they’ve got planes and trains and cars
I’ll bomb them, I’ll have no other way.
Our friends will all make fun of us
But we’ll just enjoy our hummus,
Because I got connections to do them away.
Khalaila I can promise you
That by the time we get through
America will never ever be the same
But they’re to blame.

Hey there Khalaila
I’ll be finishing my mission,
Two more hours and there will be a mess
And I’ll be regarded as the best bomber
You’ll know it’s all because of Jews
We can do whatever we want to
Hey there Khalaila here’s to you
This one’s for you…

Oh I miss you so, mummy
Oh I miss you so, mummy
Oh I miss you so, mummy
Oh I miss you so, mummy
Miss you so, mummy.

LOL

Rameez Virji — Tue, 29 Jun 2010 03:28:00 +0000

Today’s xkcd amused me:

The most hectic day EVER!

Rameez Virji — Mon, 21 Jun 2010 08:08:00 +0000

That was the longest day of my life. I blogged previously just before leaving Calgary, to go on a trip that would end up like hell. Here’s how it went:

First, I got shafted for not showing up early enough (I missed the cutoff by just a few minutes). Alright, understandable. From there, it just went downhill. I shuffled onto the old 737 and discovered to my horror that I was squeezed beside a morbidly obese woman who smelled strongly of unspeakable things. Disgusting, and for 3.25 hours. Not fun. I decided I could take my mind off of it by watching the movies on the flight. Guess what? THE ENERTAINMENT SYSTEM WAS DOWN. Dammit. Okay, let’s sleep, shall we? Nope, the weather is so bad that the ride is turbulent, and there’s a %^@$*! loud baby in the back screaming its head off. Don’t get me wrong, I love babies. They are precious and cute. This baby, however, deserved to get punched in the gut. It was the most annoying baby I have EVER had the misfortune to see/hear. So no sleep. Let’s read? Nah, the magazines are all in French, which I’m too lazy to read. Let’s… use the laptop. Battery died. Dammit, I gotta spend the rest of the flight looking out the window, bored out of my mind.

My relief was insurmountable after we (roughly) touched down amidst a lightning storm in Toronto. Although my neck was jarred from the jolt of hitting the runway, I was thankful to get away from Mrs. McDonald’s. Now, everything is to be smooth, right?

Wrong.

I stood waiting for the flight to Thunder Bay and met up with some other fellow teens going to the same program (Shad). I met up with Dennis, Arman, Jeff and Kavita, who were really friendly and helpful, and had to go through the same hell as me. These guys actually were about to land in Thunder Bay, but were re-routed mid flight to go to Winnipeg, then come back to Toronto (Jeff and Kavita’s home city) to go to Thunder Bay. Sadly, Thunder Bay lived up to it’s name, and our flight was cancelled due to a thunder storm. The irony only made it more painful for the five of us. We were to go and pick up our bags, then go to customer service to get new flights. Simple, right? Nothing can go wrong now… ARE YOU KIDDING ME? They lost one of my bags! Dammit, we waited at baggage claim for 1.5 hours, and had to file a claim for it. Then we went up, and realized that what we had gone through was nothing compared to what was in store for us.

The line was like 1.5 hours long. When we finally reached the desk, it turned out we had to split up . They gave us tickets, vouchers for food and hotel vouchers for the Delta hotel. We noticed that although Arman and I had $40 vouchers for food, poor Dennis only got $20. I think it’s because he’s asian. Kavita and Jeff decided to go home for the night. Kavita, Arman and Dennis were booked for 8:30 am tomorrow, and Jeff and I were booked for 4:30 pm. Just as we were about to leave to go to the hotel, the lady came running up to us. Turned out the hotel we were booked for didn’t support vouchers. We waited for 30 more minutes and then got a new hotel. Tired, hungry and pooped, we decide to quickly grab a bite to eat and wait outside for the shuttle. We waited, and waited. After I had finished my salad, with no sign from the hotel (Quality Inn), I began to get worried. After 1 hour of waiting, we decided to call the hotel. Guess what? Quality Inn doesn’t support vouchers either.

We rushed back to the desk, pissed. The lady was very rude, and booked us a new hotel very reluctantly. When we asked for a verification phone call, she gave us the professional equivalent of ‘screw off’. Angrier than ever, we waited for the shuttle. At last it came, and thanking the heavens, we plunked ourselves down. We had just been commenting on how the day couldn’t get any worse when we reached the hotel to meet an hour long line of other West Jet victims. We finally checked in, and as we got the room, Arman and Dennis shorgunned the beds. I gad to sleep on the couch. I can’t, because I’m hungry, (I only ate a salad for the whole day), so I’m blogging.

To sum it all up,

FML. Screw West Jet, I’m taking Air Canada next time.

I hope tomorrow doesn’t suck as much.It’s 3 AM, and we just got in the hotel room 15 minutes ago.

At the airport…

Rameez Virji — Sun, 20 Jun 2010 18:27:00 +0000

I am currently writing this using YYC’s free airport internet while sitting waiting for my flight to Shad Valley. I decided to blog about airports. So here goes.

ALWAYS REMEMBER TO COME AT LEAST 90 MINUTES EARLY!

This really screwed me over today. I came 60 minutes before my flight (it’s a domestic one, so 60 mins should be fine, right? WRONG.) Because so many people are going on vacation, it was really busy, and I ended up trying to check in 8 minutes later than the deadline. I couldn’t believe it when they said I can’t make my flight. They had to reschedule me to a later flight which means I’ll be arriving at Shad 8 hours later than originally planned . So ALWAYS REMEMBER, come 90 mins early at least.

Anyways, when I got to airport security, there was a major hold-up. Some idiot uninformed person brought a bunch of liquids in their carry on. Good job, moron, now I was stuck standing with the scary security guys waiting. Finally I went through, got an extra pat-down because I’m brown, and ended up here.

I will blog again throughout the Shad Valley program to keep you informed.

My Trip to Vietnam and Cambodia

Rameez Virji — Fri, 21 May 2010 02:51:00 +0000

This spring, I travelled to Vietnam and Cambodia on a humanitarian trip with my school. (Look for the videos on It Asploded! soon!) I thought I might share with you the final journal entry I made after the trip, which summarized the whole experience:

Final Reflections Journal – Rameez M Virji

Travelling to Vietnam and Cambodia was truly an eye-opening experience for me. It was my first time in Asia, and initially I was extremely excited to visit Vietnam. In the end, however, it was Cambodia which I enjoyed the most. When we first arrived in Saigon, I was impressed by the hot temperature and beautiful scenery. The palm trees on the sidewalks were contrasted with the thousands of mopeds on the road. I enjoyed bartering when we went to the markets; it was really different from what we were used to back in Canada.

The food, however, was great the first day, but then it got old really quick. How many times can you eat fish on rice every single day? Going to visit the school for the handicapped is an experience I will never forget. I can easily recall the happy faces of the students I managed to communicate with over there, even though they were deaf. I felt very appreciative after I left, and counted my blessings. The Cu Chi tunnels were also very impressive. Who knew the Vietnamese could be so cunning in their disguises? The tunnels and hiding spots were very intelligently crafted, as were the traps set for the intruders. Crawling through the tunnels was no mean feat either; the narrow walls and low ceiling made it hard for even a skinny guy like me to pass through. Cooking Vietnamese food was very simple, and it felt good to eat consume the fruits of our labour (literally). Cambodia, however, was the best part of the trip. Visiting the genocide museum and the killing fields was very heavy on me. I still cannot comprehend how anybody could do such things to their own people. Reading about it is one thing, but seeing it up close, with the skulls of the victims grinning in your face, that really hits home. It brings to mind what Mathieu told me – war never changes. We promise to never make the same mistakes again, and then we turn around and do it again right away. I still cringe at the thought of the tree on which they bashed the heads of innocent children to murder them. Seeing the blood-stained tiles in the classroom floors where it happened, and reading the blatantly horrible rules on the board really sent a shiver through my spine. Cambodia was hotter than Vietnam, and more humid, so we were practically roasting. As Mr. Bennett said himself every single day… forecast for today – hot! The food in Cambodia was much better. It felt good to dig my teeth into flesh that wasn’t from the water. Angkor Wat was spectacular. It was indubitably the highlight of my trip. Although it was promoted nearly everywhere in Cambodia, including the nation’s flag, I never thought it could be this amazing. It felt like an Indiana Jones movie, and just walking around the place examining the intricate designs filled me with a sense of awe. I imagine it would have taken the workers forever to carve all the details out by hand. The fact that people still went there to pray further amazed me. It was nothing short of beautiful. The Night Markets in Siem Reap were also very nice. I enjoyed bartering again and receiving something very new to me – a fish massage. When the little suckerfish swam up and began to pluck at my feet, I instantly pulled out. However, once I got used to it, I realized it provided my feet with a soothing, cleaning treatment which was much appreciated. Well worth one dollar for twenty minutes. Finally, building the playground for the orphanage was a lot of fun. Especially painting. I got paint almost everywhere on my body, even in my teeth, which probably wasn’t good for me. When the job was done, though, I felt so good. When the children begun to play on the set, I felt so proud and happy that my work was going to provide an entire community with fun for years to come. It felt good. Before I forget, I also enjoyed filming it all in extensive detail, which annoyed everyone, but I’m pretty soon they’ll all appreciate it when they watch it later.

That’s all, folks!

Sid and the Pens win it!

Ali Virji — Fri, 30 Apr 2010 19:10:00 +0000

Sid the Kid finally got what he has always dreamed for – the Stanley Cup! He became the youngest captain in NHL history to hoist the Cup. Powered by a couple of great goals by Maxime Talbot, the Pens defeated the Detroit Red Wings in game seven of the Stanley Cup Finals. They were the first team in over 20 years to lose in the finals then win it the next year and the first team in over 30 years to win the cup away from home. The Pens kept it going even after Sidney Crosby, their superstar captain, was injured in the second period. They won 2-1. Fleury made a great save with just seconds to go to preserve the lead, and win the Pens the Cup. Evgini Malkin won the Conn Smythe trophy. They really deserved this trophy and did not let any loss get in their way. Detroit should not have even been in the finals, as I believe that Chicago should have won the Conference Finals. I am very glad that the Penguins won. I mean, c’mon, Detroit??? They are a bunch of oldy’s with a good coach, that’s all! The Pens have real, young talent. and a great coach! They got what they deserved!

Big Tree Blog

Quick and Easy Super-Customizable Tabbed Content in JavaScript and CSS

Requirements: HTML (basic understanding), JavaScript (basic understanding), CSS (basic understanding)

Step One: Setting up the basic CSS

Step Two: Setting up the JavaScript

Step Three: The HTML itself!

Step Four: Customisation

Adding another tab:

Making it look pretty:

The Clash of Ignorance, the Unstable Political Situations, and the Loss of Culture

Williamizing: Episode 2 – The Historie of Robert the Sponge

Williamizing

By Rameez M Virji

THE HISTORIE OF ROBERT THE SPONGE

By William Shakespeare

Williamizing: Episode 1–The Comedie of the Freshe Prince of Belaire

Williamizing

By Rameez M Virji

THE COMEDIE OF THE FRESHE PRINCE OF BELAIRE

Hey there, Khalaila

LOL

The most hectic day EVER!

At the airport…

ALWAYS REMEMBER TO COME *AT LEAST* 90 MINUTES EARLY!

My Trip to Vietnam and Cambodia

Sid and the Pens win it!

ALWAYS REMEMBER TO COME AT LEAST 90 MINUTES EARLY!