'Flick scrolling', or kinetic scrolling, is when the user can scroll a menu with momentum.
While developing a user interface at work I discovered that 'flick scrolling' is not enabled by default in the mobile Safari browser.
Long story short, this webkit snippet will solve your problem:
-webkit-overflow-scrolling: touch;
Just put it in a css class and add it to anything that should have 'flick scrolling'.
Snippets of code and tricks that would otherwise be forgotten. Useful for me, hopefully for you too.
Thursday, June 6, 2013
Thursday, May 23, 2013
JSONP XMLHttp Requests
// define a 'success' callback to handle the results of the request
success = function () {
// this is called on success
}
// add the callback function 'success' as the query parameter 'callback'
var url = "http://www.api.com/endpoint?callback=success";
// create a new SCRIPT tag, assign the url to the 'src' attribute and append to the HEAD tag
var s = document.createElement("script");
s.src = url;
document.getElementsByTagName("head")[0].appendChild(s);
// couldn't be easier
Wednesday, May 22, 2013
HTML5 File API resources
I'm starting a project using the HTML5 File API and I'm excited about what new things are possible.
Javascript interacting with the local file system? Front-end nerds rejoyce.
Official W3C Spec:
http://www.w3.org/TR/file-upload/
A great set of examples on html5rocks.com :
http://www.html5rocks.com/en/tutorials/file/dndfiles/
Javascript interacting with the local file system? Front-end nerds rejoyce.
Official W3C Spec:
http://www.w3.org/TR/file-upload/
A great set of examples on html5rocks.com :
http://www.html5rocks.com/en/tutorials/file/dndfiles/
Monday, May 20, 2013
Programatically triggering Rules in Drupal 6
Sometimes a rule needs to be triggered and there is no existing event that can be used to trigger it. The good news is that you can trigger events programatically without much trouble.
In this example we'll create a rule that sends an email to all users with a certain role. We'll be writing this as a module for Drupal 6.
The first step is creating the event with hook_rules_event_info():
function modulename_rules_event_info() {
return array(
'modulename_event' => array(
'label' => t('Event Name'),
'module' => 'modulename',
'arguments' => array(
'user' => array('type' => 'user', 'label' => t('User.')),
'node' => array('type' => 'node', 'label' => t('Node.'))
),
),
);
}
Clear your Drupal cache to ensure that Drupal knows about your new event.
Now, navigate to the 'Rules' section on the Drupal admin area and create a new rule. You should notice that your event is listed near the bottom of the 'events' select menu, under a heading of 'modulename'.
Continue to create the rule by defining conditions and actions to be evaluated when the event is triggered.
Now, to trigger the event programatically... enter this method in your module code at the point when the event should be fired:
rules_invoke_event('modulename_event', $user, $node);
An easy test is to send yourself an email with the rule, or use drupal_set_message() to output some text to the screen.
For more info see: http://drupalcontrib.org/api/drupal/contributions%21rules%21rules%21rules.api.php/function/hook_rules_event_info/6
In this example we'll create a rule that sends an email to all users with a certain role. We'll be writing this as a module for Drupal 6.
The first step is creating the event with hook_rules_event_info():
function modulename_rules_event_info() {
return array(
'modulename_event' => array(
'label' => t('Event Name'),
'module' => 'modulename',
'arguments' => array(
'user' => array('type' => 'user', 'label' => t('User.')),
'node' => array('type' => 'node', 'label' => t('Node.'))
),
),
);
}
Clear your Drupal cache to ensure that Drupal knows about your new event.
Now, navigate to the 'Rules' section on the Drupal admin area and create a new rule. You should notice that your event is listed near the bottom of the 'events' select menu, under a heading of 'modulename'.
Continue to create the rule by defining conditions and actions to be evaluated when the event is triggered.
Now, to trigger the event programatically... enter this method in your module code at the point when the event should be fired:
rules_invoke_event('modulename_event', $user, $node);
An easy test is to send yourself an email with the rule, or use drupal_set_message() to output some text to the screen.
For more info see: http://drupalcontrib.org/api/drupal/contributions%21rules%21rules%21rules.api.php/function/hook_rules_event_info/6
Wednesday, May 8, 2013
Adding mysql to your Path environment variable
Environment Variables in Windows -> Edit.
Under system variables select the path variable and click the edit button.
Each path in this field must be separated by a semicolon ; with no spaces.
Example path: C:\Program Files\MySQL\MySQL Server 5.1\bin
Tuesday, April 16, 2013
Min and Max sliders with HTML 'range' inputs
I wrote this for work the other day and it won't wind up being used, so here it is. These two event listeners can be used on two HTML <range> inputs for a 'minimum and maximum' selection. The max cannot be set smaller than the min and the min cannot be more than the max.
The HTML:
Minimum Font Size:
<input id="font_min" type="range" min="10" max="80" step="1" value="12" />
<span id="font_min_val"></span>
Maximum Font Size:
<input id="font_max" type="range" min="10" max="80" step="1" value="30" />
<span id="font_max_val"></span>
The jQuery:
$("#font_min").change(function () {
$("#font_min_val").text($(this).val()+"px");
if ($(this).val() >= $("#font_max").val()) {
$("#font_max").val($(this).val());
$("#font_max_val").text($("font_max").val()+"px");
}
});
$("#font_max").change(function () {
$("#font_max_val").text($(this).val()+"px");
if ($(this).val() <= $("#font_min").val()) {
$("#font_min").val($(this).val());
$("#font_min_val").text($("font_min").val()+"px");
}
});
The HTML:
Minimum Font Size:
<input id="font_min" type="range" min="10" max="80" step="1" value="12" />
<span id="font_min_val"></span>
Maximum Font Size:
<input id="font_max" type="range" min="10" max="80" step="1" value="30" />
<span id="font_max_val"></span>
The jQuery:
$("#font_min").change(function () {
$("#font_min_val").text($(this).val()+"px");
if ($(this).val() >= $("#font_max").val()) {
$("#font_max").val($(this).val());
$("#font_max_val").text($("font_max").val()+"px");
}
});
$("#font_max").change(function () {
$("#font_max_val").text($(this).val()+"px");
if ($(this).val() <= $("#font_min").val()) {
$("#font_min").val($(this).val());
$("#font_min_val").text($("font_min").val()+"px");
}
});
Thursday, April 4, 2013
Blender Hotkeys I will never remember
r - rotate current object. use x,y,z to contrain axis of rotation.
s - scale. use x,y,z
g - move - use x,y,z
z - toggle wireframe view
NumberPad keys control view angle.
NUM5 - toggle 3d / orthographic view
b - marquee / loop selection
SHIFT+R - initiate loop cut. Use mouse wheel to select the number of loops to cut
CTRL+D - duplicate an object. use x,y,z to constrain to one dimension for relocating the clone
s - scale. use x,y,z
g - move - use x,y,z
z - toggle wireframe view
NumberPad keys control view angle.
NUM5 - toggle 3d / orthographic view
b - marquee / loop selection
SHIFT+R - initiate loop cut. Use mouse wheel to select the number of loops to cut
CTRL+D - duplicate an object. use x,y,z to constrain to one dimension for relocating the clone
Subscribe to:
Posts (Atom)