Bedrich Rios

Using coordinates to place an abolutely postioned element on a page may seem like a bit of an overkill when you can just assign the top, bottom, right, and left values in the CSS but believe me is not. I have used this effect in combination with the Text-Resize Detection script published on A List Apart to re-position an element next to another at all times (the project demanded this effect) regardless of window or text resizing. The things you can do with this nifty trick are only limited by your imagination. Look at a demo of the “trick” at work if you wish to see it before reading the tutorial. Enough rumbling, let’s begin.

Gathering Neccesary Information

There are a couple of things we are going to need to know before beginning to write the script and they are:

• The name (id or class) of the element we are trying to get the coordinates of, which I will call “static_box (id name)” during this tutorial.
• And, the name (id or class) of the element we are moving around, which I will call “moving_box (id name)” during this tutorial.

Now we can begin recreating what you saw on the demo. First, let’s start by creating the functions we will need in order to position the moving box to either the left or right of the static box. In this step we will write the commands for the main function only. In other words, we will absolutely position the moving box and give it top and left values.

» Continue Reading ...

After arduous days of CSS coding, cross browser testing, icon resizing, and sleepless nights the new theme for bedrichrios.com is ready. Everything should work fine but please feel free to contact me if you encounter a broken link or a CSS quirk. Also, expect to see some weirdness in the days to come as I will be tweaking the design a bit more. If you are wondering why I decided to redesign the site, well, it has to do with the growth of my blog and the attention is getting thanks to the fact that one my posts is featured on the homepage of csselite.com. In case you haven’t read it yet, make sure to check out the Mootools Style Sidebar Using jQuery post. Because of this post, a lot of ideas have been orbiting my head. The main conclusion, jQuery scripts mean more traffic and love for this site.

» Continue Reading ...

I have been quite busy the last couple of weeks and thus have been unable to update the site much. The stats have not fallen dramatically thanks to the Mootools Style Sidebar Using jQuery post, which is featured on the homepage of csselite.com. However, things are going to change soon.

Homepage

In the month to come, the homepage of bedrichrios.com as you know it well undergo some major changes. In fact the whole site will be restructured around the blog. There will be some redesign work as well. This means that whenever you visit the site in the near future, you will encounter the most recent post rather than my portfolio. Take a look at my portfolio still though maybe we can do some business.

» Continue Reading ...

Just a quick post to let you know that Mozilla has released its 5th and final beta update for the upcoming Firefox 3 release. Download your copy of Firefox 3 Beta 5. Enjoy!

» Continue Reading ...

Another Monday is here and that means a new reading list. Feel free to leave comments with your favorite week’s reads.

The List

1. Collection of Web Based Text Editors
2. YouTubePlayer Makes YouTube Player Looks Nicer
3. Mozilla Asa Dotzler on Firefox, Fighting Bloat and the Problem With Democracy
4. Adobe Photoshop Video Tutorial, Best Of
5. Camino 1.6 Beta 4 Released!

» Continue Reading ...

In my last post I promised a “first impressions” post of WordPress 2.5 Release Candidate 1; however, after a few paragraphs, I realized that for the most part I was outlining the same points outlined in the WP 2.5 Sneek Peek post. Therefore, I have decided against writing the promised post and instead make two lists containing the “Good” and “Not So Good” of WordPress 2.5.

» Continue Reading ...

Well, it seems like forever since my last post. In any case, I have been busy collecting a great list of web design related post this last week. A lot of great reads and very interesting and exciting news. From IE8’s new approach to dealing with web standards to WordPress’s 2.5 Release Candidate 1. This list should keep you busy for a while. Please feel free to comment and share your own finds.

The List

1. 11 Accessibility Tips
2. How To: Create a Tabbed Box with YUI Tabs
3. 6 Web Design Tips From Leonardo Da Vinci

» Continue Reading ...

Sorry for not writing the usual Monday Roundup post yesterday, but these last couple of days have been hectic. I had some personal problems to tend to. In any case, I promise next week’s roundup will make up for the one lost this week.

Bedrich

» Continue Reading ...

Exactly what the title says. This is just a quick post, go and check it out yourself. Download the latest Firefox beta.

Initial Thoughts

So far so good. Pages are loading as fast, if not faster, than they do on Safari. Firefox 3 is definitely much more integrated with Mac OSX.

If you are having some problems with the way the theme looks in this new release, go to view -> toolbars -> customize and change the icons to small. This will cause the big, over the top, back button to be reduced to a reasonable size.

» Continue Reading ...

Well another monday is upon us and it is time to write another roundup list. So here is the list:

The list

1. Table-Based Layout is the Next Big Thing.
2. Flow Player Open Source Flash Video Player for the Web.
3. JavaScript Carrousels.
4. Free Fonts of the Month.
5. Mootools Effects Compilation.

» Continue Reading ...