Blog
Random thoughts and musings, often some code examples and experimentations.
Random thoughts and musings, often some code examples and experimentations.
Regardless whether you are trying to highlight every other row on a table, or div’s with classes, this script will highlight alternate rows
$count = 0;
while ($i = mysql_fetch_array($result)){
$count++; // increases by one on each iteration of loop
if (is_float($counter/2)){ $class = "grey"; } else{ $class = "white"; }
echo ‘Content’; // either grey or white
// Alternatively
echo ‘Content’; // either grey or white
}
May 28, 2008 Retweet
In an effort, and a rather lame one at that, to gain more publicity of my personal blog, I signed up to Technorati today, and you can catch my profile here: Technorati Profile, they basically told me to add this post here to confirm my existance and ownership of my blog. Not bad way of doing things really.
I will watch this space to see if I get any posts or comments in the coming days, rather than just SPAM.
May 28, 2008 Retweet
OK, so IE6 has its fair share of faults, and troubles, but when it comes to HTML href links you would think even Microsofts previous explorer would have no trouble.
Not so. I recently completed a project for a client for my new company im working for Free-Rein. Having completed the project, and having it signed off a week ago, they telephoned today with the disasterous news that in some of their browsers all they had was a flat site. No links, form elements or text was clickable.
I had to see this for myself, and sure enough, no links.
Whilst I am uncertain why IE6 is behaving like this, I know the resolution. The CSS declaration on every element that requires a clickable element; position: relative;.
As soon as I implemented this simple declaration, the links were back.
So, in conclusion. If your having trouble with your links in Internet Explorer 6.0 mark your CSS with this:
position: relative;
May 19, 2008 Retweet
This is the first of a X part series, (Once I have figured out how many parts there will be, I’ll update that X!) and comprehensive guide on how to design, create, form and install your first content managed web site using Dreamscape. (Much of the series will be based upon Expanse CMS 3.1, though both systems are very similar).
This first article explains where to start in your effort to produce a bespoke custom built web site of your own.
Some tools you will need, as well as some basic knowledge of CSS, XHTML and photoshop (or other graphic studio);
Three simple tools to get you started, we will start off however with good old fashioned pen and paper.
A good place to start is taking a look at the elements that usually build up any web page.
Unless you are like me, who can visualise how a user is going to navigate, open, look through and read a web site in your head, then it is always best to jot your ideas down, and plan your attack on paper, choose an A4 sheet, turn it landscape, and visualise that as your browser window, mark out where you want your logo, how wide you want your content, where the text is aligned, centred to the window, or to the left or right.
Once you have done that, start building elements into the shapes, scribble in your logo, roughly draw a menu, shade in a sidebar, group a footer together, and start to build up your idea of a fully fledged web site which you yourself would want to visit.
Once you have done that its time to open Photoshop or your graphic editor of choice.
Its a good idea to start by knowing how wide you want your content, as you read this, my content is held within a space of 800px - thats 800 pixels. Screens are getting wider with an average screen size being 1024px by 768px, you will want to take advantage of all that screen real estate. If your going to have your content set at 800px create a new document with a width of 1000px by 1000px, this will give you an idea of what your finished article will look like in a browser window.
Once you have created your document, the first point of call will be to add some guide lines, if your using Photoshop grab the rulers with your mouse and drag into position. Depending on where on the screen you wish your content is how you place your guide lines. If your after a centred look, drag your first guide line to 100px, and your second at 900px, this will give you an idea of your workable space between the two guidelines.
Next think about how much space you want to offer up for your "Header", above you will see that I have provided 157px to contain all that I want. But feel free to choose as much or as little as you like.
Bare in mind though your logo, as you will want to add it inside your header (although there is no rule stipulating that you must do it this way). For this tutorial this is where we are going to place it however.
So drag a guide line to the bottom of where your header will appear, then to the bottom of your menu - that is if you are going to have a menu across your page, under the header. Else you can skip that guide line and go straight to your footer, I tend to only provide 50px, but you can have more if your design calls for it.
If your menu is going to go down the page on either side of your layout, go ahead and drag a guideline to where you want it to finish, vertically.
As you can see on my design I have provided 200px on the left hand side of my content for the menu, and some sidebar space if I wish to use it underneath.
What you should have left is a nice area to which to enter your content.
Now is the time to start to add color to your image. Start with the background, are you going to have a white background, a solid color, a pattern, or perhaps a gradient, what ever you can think of, go ahead and put it in.
Do the same for all the elements you have just created, including your logo, what you will have left is the start of something spectacular. Try to think of all the elements your page might have, it is advisable to have several layouts of the same base outline for different pages, for example one for a blog, another for a contact page, and an alternative layout for a gallery page.
Dreamscape lets you have many styles of categories;
Be thinking about what you want your content to look like on these pages as you design, and create a layout for each page.
May 14, 2008 Retweet
To Reset your Freecom Network Hard Drive you need to power off the drive, whilst keeping the unit plugged in, press the reset button, then still pressing turn the unit on, keeping the reset button pressed down for about 15 seconds, to completely restore the unit to factory settings.
I only say this first as upon recieving my Shiny new Freecom Drive I thought, follow the quick instructions, plug and play, there it is in my networks. No. I could see the drive in the utility which came on the setup CD, using a different IP to that of my network, I’m using BT Home Hub, and its generic normal IP range. So within trying to find the Freecom on my network I restarted the hub, restarted the drive, then, inspiration hit, plug the unit directly to my iBook G4.
Straight away the web config page launched on its IP and I was in with the factory Username and Password, admin. All good so far, but not for long, changing the IP address to that what I thought my Home Hub was dishing out to it, and adding the subnet, and gateway, I clicked apply. May I stop you right now, please do not go ahead and do this on your own unit, read the manual on the disc, its PDF, and you can search if your running Adobe Acrobat 8. If I had have read this instructions I would have read not to click on automatic IP when my change didn’t work.
The Freecom unit comes shipped with DHCP enabled. Selecting automatic, or trying to configure your own IP whilst in this state will render your Freecom HD untraceable. Then you need to reset it to factory settings, and start again. Follow these instructions instead, or read the PDF that comes on the setup disc on how to join your hard drive to an existing network.
Please note (I did not):
"For initial configuration, always connect your Freecom Network Drive to a PC first! Do not connect the Freecom Network Drive to an existing network when using it for the first time!"
As default, the DHCP Server of the Freecom Network Drive is switched on. This can be changed in the “Status” section of the web configuration.
Connect your Freecom Drive directly to your PC/Mac and the launch the web interface.
In the web interface, click on “Status” to change the basic settings of the Freecom Network Drive. Under Status - Network Information select DISABLED radio button and hit apply. In the “IP Config” section of the web interface it can be configured whether the Freecom Network Drive has a static IP address or gets an automatic IP address assigned by another DHCP Server in the network.
Hey presto, its done. You can see your Hard Drive in the network places screens, and access the admin pages once your drive is disconnected from your PC/Mac and plugged into your network, or more importantly plugged into the Home Hub ethernet port 2.
May 13, 2008 Retweet
So. I came to work on a design for a client, and start to put together something for my launch page for my main domain, www.iantearle.com.
Upon launching Adobe Space Monkey, I waited patiently for the fonts to load, presets to be imported, hang on a minute. Adobe Space Monkey?
When the adobe comedy splash screen disappeared and presented me with the error that had happened, (invalid serial) I was a little concerned, you don’t pay stupid amounts of money for a creative suite to be presented with this comedy of errors.
Immediately I was onto Google. Thank you SamBot you saved my life. The kind folks on the blog there provided me with this super information. Which I will share here for you.
Find the missing entries on the following parameters in your Adobe Registration Database, (Mac: Libary/Application Support/Adobe/Adobe Registration Database).
EPIC_ORG=
EPIC_NAME=
Enter after the equals the values as per the rest of the entries in that document. You can use TextEdit to edit and save the document.
How I came to Space Monkey, well I stupidly lost the ability to think. And forgot how to print a PDF document with a Mac, working with PC’s at work disables the part of the brain to be able to come home and back to the real and proper world of a well made operating system that is OSX.
Of course when I came to look for Adobe Distiller and it was not there, I loaded up the install disc of CS2 got to the registration page and exited.
In doing so the Adobe Registration Database must have been altered and along came a comical monkey!
For those who do have their brains numbed by Mickosoft, to be able to save or print a PDF you use the link at the bottom left hand corner, there are plenty of options to create, compress and save your PDF!
Woops.
May 2, 2008 Retweet
Firstly a big thank you to the original poster of this bug, Jamie Thomspon thank you very much, although it took me a while to find it, thus I am posting it here for reference use.
The issue being is that Safari has trouble with hide/show methods on elements when used by jQuery. The same bug has been reported about fadeIn/fadeOut methods also, although I have not experienced this.
The issue can be solved by the use of CSS. By applying CSS rules to the element, Safari appears to control the hide/show methods correctly.
// This fails in Safari
$(element).hide();
// Change it to this
$(element).css('display','none');
April 29, 2008 Retweet
Here is a useful list of CSS selectors to be used throughout your CSS documents. We will be using many of them in the upcoming series "The Comprehensive Guide, Dreamscape".
However much you know about HTML, these selectors should be obvious, and easy to understand, within HTML markup you use "elements" (a), "attributes" (href="") and "values" (title=""); in the same way CSS markup uses "selectors" (#title), "properties" (width:) and "values" (200px;).
So to get you started:
April 23, 2008 Retweet
If you have ever been annoyed by the constant Orange Flashing when recieving a message from within MSN then fear not. Here is the solution to be rid of the phantom once and for all.
The issue is when Windows wants to get your attention to something when the application is out of focus. The next steps are going to guide you through RegEdit in Windows XP. Please don’t proceed if you are not comfortable.
open up HKEY_CURRENT_USER/ControlPanel/Desktop
Click on the Desktop option and then look down the list on the right for the following:
foregroundlocktimeout
The right hand list is divided into three sections - Name Type and data.
Look in the Data section and check that the following is present:
0x00030d40 (200000)
If this data is present then the Prevent applications from stealing focus option is enabled.
If you have something different then proceed as follows:
Right click on the ForegroundLockTimeout option and select Modify
The Edit DWORD value box opens
Make sure there is a green dot next to the hexadecimal option in the Base box
Now in the Value data box type: 30d40 (that’s thirty followed by d
then followed by 40)
Click the OK button
Your entry should now read:
ForegroundLockTimeout REG_DWORD 0x00030d40 (200000)
Now close regedit and reboot your machine.
April 22, 2008 Retweet
Since writing my last post on the time_since() function, I became frustrated and tore apart the original script, to write my own time_since() function. This function is highly adaptable for those who want to have multiple phrases for the amount of time that has passed.
For example, if you would like to say "just a moment ago" for less than 10 seconds ago, or "about a minute ago" for time within a minute ago you can. You can even say your post was left "yesterday". I have not finished developing the script, but here is what i have done so far.
/*
— — — — — — — — — — — — — — — — — — — — — — — — — — — — — —
Time Ago Stamp
============================================================
*/
function time_since($mbtime){
/* Current unix time */
$now = time();
$diff = $now - $mbtime;
/* Convert PHP time/date to legiable data, to do the math */
$today = date(‘dmy’, $now) === date(‘dmy’, $mbtime) ? true : false;
/* Here is the fun part, how many phrases can you think of?
This may help: some Math.
the $diff is the amount of time that has passed. So to get the amount of
seconds, minutes, hours passed you need to divide by the figure you wish.
So say you want seconds:
$diff / 1
minutes:
$diff / 60
hours:
$diff / 60 * 60
days:
$diff / 60 * 60 * 24
The same equations can be made for defining if the time should be less
than an amount, so if you want to say something for less than 10 seconds
ago:
$diff < 10
less than an hour:
$diff < 60 * 60
*/
if($today && $diff < 10){ // if less than 10 seconds ago
$num = ceil($diff / 60);
return ‘a moment ago’;
}
elseif($today && $diff < 60){ // if less than a minute ago
$num = ceil($diff / 1);
return $num . ’ second’ . ($num > 1 ? ‘s’ : ”) . ’ ago’;
}
elseif($today && $diff < 60 * 1){ // if less than 1 minute ago
$num = ceil($diff / 60);
return ‘about a minute ago’;
}
elseif($today && $diff < 60 * 60){ // if less than an hour ago
$num = ceil($diff / 60);
return $num . ’ minute’ . ($num > 1 ? ‘s’ : ”) . ’ ago’;
}
elseif($today && $diff < 60 * 60 * 2){
$num = floor($diff / 60 / 60); // if hours ago
return ‘a couple of hours ago’;
}
elseif($today){
$num = floor($diff / 60 / 60); // if hours ago
return $num . ’ hour’ . ($num > 1 ? ‘s’ : ”) . ’ ago’;
}
else{
$thisyear = date(‘y’, $now) === date(‘y’, $mbtime) ? true : false;
$daydiff = date(‘z’, $now) - date(‘z’, $mbtime);
if($daydiff === 1 && $thisyear){
return ‘Yesterday’;
}
}
return $mbtime;
}
April 18, 2008 Retweet