RSS
 

Archive for August, 2010

CSS Quirks And Tricks

24 Aug

This is to document some CSS tricks and quirks that can be used to optimize a site’s look. This post aims at documenting all the little tricks that I found out through the Internet or by myself for easy reference.

Avoid overflow effect

The best way to fix this seems to be to force the scrollbar to be on in Firefox (and other browsers). You simply add the following to your CSS:

html {
  /* needed for it not to jump pixels */
  height: 100%; 
  margin-bottom: 1px;
}
body {
  /* needed for it not to jump pixels */
  height: 100%; 
  margin-bottom: 1px;
}

Avoiding overflow in the body to move the content to the left when a scrollbar is shown is done by giving the body a slightly smaller width. This is not a beautiful solution but should work in most scenarios. E.g.

body {
  width: 95%;
}

Internet Explorer clear fix

It took me a while to figure out how to fix this in IE. The problem is that IE does not render a div on the next line if you do a clear: right on the last div in a line.
To fix this issue, you need to create another element after the last element in a row:

.col1 {
  float: left;
}
.col2 {
  float: left;
}
br {
  clear: both;
  display: inline;
}
<div class="col1">some content</div>
<div class="col2">other content</div>
<div class="col1">some more content</div>
<div class="col2">more other content</div>
<div class="col1">even more content</div>
<div class="col2">even more other content</div>
<div class="col1">some content</div>
<div class="col2">other content</div>
<div class="col1&gt;some more content&lt;/div&gt;
&lt;div class=">more other content</div>
<div class="col1">even more content</div>
<div class="col2">even more other content</div>
 
No Comments

Posted in CSS

 

Big Band Jazz Concert – 12/09/2010

19 Aug

On Sunday 12/09/2010 at 4.30pm there is a concert of the Manawatu Jazz Club Big Band at the Masonic Hotel, which I am part of. I will be playing at least one solo, so be prepared, whatever that means :)

There might be a small cover charge, however last time it was not compulsory.

Hope to see you there. If you are into Jazz it is well worth the visit. We often have high quality singers and we are generally well accepted.

 

JavaScript Concepts

06 Aug

Having learned JavaScript mainly by doing, it was quite late that I figured out some important details. Please comment if you think or know that I’m wrong.

The arguments array as well as the caller instance are universal variables inside every JavaScript function. The names are self-explanatory.
An anonymous function inside another function keeps the variables in scope as in:

var somefunction = function(arg1) {
  var avar1 = 10;  
  object.onclick = function() {
    alert('arg1=' + arg1 + ' avar1=' + avar1);
  }
}
somefunction('Foo');
// "arg1=Foo avar1=10" when object is clicked on

So this means that the scope of the function defines what variables can be accessed within it, even after the function call has finished.

Another part I always found confusing in JavaScript is the “this”-keyword, but that might have to be the topic of another post.

 

How I quit smoking

06 Aug

Today I thought about how I gave up smoking. Since it is not an easy task and most people struggle with it, I thought I would share my story.
I only started smoking when I was about 18, which is late for German standards. Most people from my age group started with 16 (legal) or even earlier than that. I never smoked very heavily, except for one point where I was on about 20 cigarettes a day. That was a lot for me and is for anyone who does not smoke or not much. Anyway, I was always sort of on and off smoking, could never quite give up but was not extreme either. Yes, some people smoke 40 or even 80 cigarettes a day, just to give non-smokers an idea.
Anyway, back to how I stopped:
For a few years I tried going off it slowly, it seemed like the best approach. Get the body used to having less and less seemed like a great idea. That however didn’t really work for me. The famous last cigarette was always so good that I had to have one again.
A bit later I tried nicotine patches which was probably the worst idea, at least in my case. They put so much nicotine in there that you get even more addicted to it and when you want to go off the patches you crave for cigarettes anyway. Also, it was not only the nicotine what made cigarettes nice. It was the habit and the head rush when inhaling the smoke and having something to do when one was stressed.
However, later I discovered that the best method to quit was to do a cold turkey, meaning going from absolutely smoking to absolutely not. Also, you have to really want it for yourself and not do it for anyone else. It has to be your idea and you need a lot of will-power. Also, for me it didn’t help to tell myself that I would never smoke again. I just wanted to stop because it is healthier and less expensive and doesn’t really have much benefit over the head rush thing or the also fading coolness factor. You have to want to stop because you want to. I have been off cigarettes now for more than a year and think I can keep on doing that at least until I am 70. By then I probably wont want to start again unless I’m a lonely old sole. A small book that I read also helped a little bit, but most of all my own will and the fact that I was ready for quitting.
I hope this helps someone out there with the same or a similar addiction.

 
 

GeoExt and OpenLayers – Zoom Mode

03 Aug

Just playing around with GeoExt and OpenLayers, I figured out how to easily change the control to a zoom rectangle with minimal changes:

First create the normal and the custom control with:

var inZoom = false;
var navigation = new OpenLayers.Control.Navigation();
var ZoomBoxNav = OpenLayers.Class(OpenLayers.Control.Navigation, {
 zoomBoxKeyMask: null // this ensures that a box is always drawn
});
var zoomBox = new ZoomBoxNav();

Then all you need is a button or better Action object, which adds the appropriate control to the map:

var toggleRectZoom = function() {
  if (inZoom) {
    map.addControl(navigation);
    map.removeControl(zoomBox);
    inZoom = false;
  } else {
    map.addControl(zoomBox);
    map.removeControl(navigation);
    inZoom = true;
  }
}
 
zoomButton = new GeoExt.Action({
  text: 'Zoom Mode',
  handler: function() {
    if (inZoom) {
      zoomButton.setText('Zoom Mode');
    } else {
      zoomButton.setText('Pan Mode');
    }
    toggleRectZoom();
  }
});
 
toolBar = new Ext.Toolbar({
  items: [ zoomButton ]
});
mapPanel = new GeoExt.MapPanel({
  border: true,
  region: "center",
  // we do not want all overlays, to try the OverlayLayerContainer
  map: map,
  center: [172.1569825, -42.6109735],
  zoom: 6,
  layers: myLayers,
  tbar: toolBar
});