iOS AND ANDROID
Topics:
Choose a tagWhen was last time u saw a Delorean??? He couldn’t get to 88 mph as the speed limit was 65:)
Thanks, Mike
This happened to me on my home machine yesterday and today it started on my work laptop. Of course I just ran updates for Firefox, so I figured it had something to do with that, but what is strange is that the YSLOW extension from yahoo is culprit.
If you disable the YSLOW extension, then you’ll be able to type in the search bar again without it crashing firefox. I found the original solution here:
http://support.mozilla.com/no/forum/1/566506
After developing a few websites that have content reveal and accordion scripts, I decided to take what I learned and write my own simple, very customizable content reveal script. Since the web has helped me so much with learning about jQuery, I wanted to share my code.
This script helps creates clean layouts where there is a lot of content. To see the final result, take a look at the demo at the bottom of this post.
First, download the jQuery library (I recommend the minified version since it is lightweight). Link the library to your page using the following code:
<script src="path-to-directory/jquery-1.4.min.js" type="text/javascript"></script>
Paste this code between the <head></head> tags; if you paste it into a seperate javascript file, remove the <script> opening and closing tags:
<script type="text/javascript">
$(document).ready(function() {
//expand all or hide all options
$('#tools a.expand').click(function() { $('#reveal .content').slideDown('slow'); $('#reveal .header a').addClass('active'); });
$('#tools a.hide').click(function() { $('#reveal .content').slideUp('slow'); $('#reveal .header a').removeClass('active'); });
//individual header click toggle
$('#reveal .header a').click(function(){
//collapse and remove active class, if the div is opened it will close
var activeHeader = $(this).hasClass('active');
$(this).removeClass('active').parent('div').next('.content').slideUp('slow');
//open the div if it is closed and add the active class
if(activeHeader==0)
{ $(this).addClass('active').parent('div').next('.content').slideDown('slow'); }
});
});
</script>
I color coded some of the classes that the script calls. If you want to change the class names be sure to also change the classes in both the HTML and CSS. I have the tags colored to match in the CSS and HTML code snippets. The code is also commented to explain what each part does.
Paste this code between the <head></head> tags; if you paste it into a seperate css file, remove the <style> opening and closing tags:
<style type="text/css"> #reveal { color:#444; font-family:Arial, Helvetica, sans-serif; font-size:12px; width:300px; } #reveal #tools { color:#39f; cursor:pointer; font-size:10px; margin-bottom:3px; text-align:right; } #reveal .header { border:1px solid #999; cursor:pointer; margin-bottom:3px; -moz-border-radius:5px; -webkit-border-radius:5px; padding:3px 0; } #reveal .header a { background:url(path-to-directory/arrow-inactive.png) no-repeat right; color:#00aef0; display:block; margin:0 10px; } #reveal .header a.active { background:url(path-to-directory/arrow-active.png) no-repeat right; } #reveal .content { display:none; padding:10px; } </style>
Most of this code is styling. Important parts of the CSS are in red font:
Paste this code inbtween the <html></html> tags where you want the content reveal to show up:
<div id="reveal"> <div id="tools"> <a class="expand">Expand All +</a> <a class="hide">Hide All -</a> </div> <div class="header"><a> Header One Toggle </a></div> <div class="content"> Content under the first header </div> <div class="header"><a> Header Two Toggle </a></div> <div class="content"> Content under the second header </div> <div class="header"><a> Header Three Toggle </a></div> <div class="content"> Content under the third header </div> </div>
To quickly explain what each part of the code is used for:
As long as all of the code is pasted in the correct areas of your page and you changed the directory paths to where the jQuery library and arrow images reside, then you should come up with the following result:
Project Sikuli is a new automation program that can be programed using screenshots. Yes, screenshots! You can automate anything on your PC or MAC using screenshots. Don’t believe me, check out the vid. Then check out the Project Sikuli site.
We usually have to rapidly prototype website UI all the time. We’re asked all the time, what’s the best program to wireframe within. Yes, we use OmniGraffle, Adobe InDesign, as well as Microsoft Visio to properly document UI screens and flows, but that’s usually not where we start.
Working with programs are usually slow and cumbersome; not only that, but they force us to think within their own limited set of constructs.
We start with a pencil, eraser, and paper. It not only helps us to produce screens quickly, it helps us to push ourselves to create multiple variations of screens to fully explore different interaction models.
“But Pinaki, I can’t draw?!?!”, you say. After I give you a mocking laugh, I’ll tell you that anyone can draw. Go ahead, pick up a pencil and paper. Draw a line. Now, draw a rectangle. Next, draw a circle. How about a star? If the objects on your paper can be identified by someone else, then you can sketch UI and wireframes.
Geekchix.org‘s Ivana Jurcic posted a lovely collection of printable paper-based wireframe templates and sketch books. Perfect for printing and prototyping.
Thank you Ivana, for the great post and photo for our homepage.
I’ve sure you’ve all seen commercials recently for this. While the idea itself sounds amazing, 256 people on 1 map as a 1st person shooter, you quickly start to wonder, can I survive more then 10 secs?
The video looks good of course, but the beta reviews are showing a different story:
“I’m sure you know the basics of MAG, but if you need a refresher, this is the game that boasts MMO elements and 256 players online. When you start a career, you’ll side with one of the three private military corporations in the game (Valor, SVER or Raven) and begin fighting battles in its honor. You’ll be part of an eight-man squad that’s part of a 32-man platoon that’s part of the 128-person army. Each of those levels have leaders who are to guide the troops as one organized unit of attack.”
“I enjoy running and gunning as much as the next guy and taking down a room filled with enemies, but it’s a pain to wait 20 seconds to respawn, then run forever to the next objective, and then get sniped by someone camping over on the horizon. Don’t get me wrong, I know that happens in these types of games all the time, but you’re being asked to cover a lot more ground than your usual shooter and then you have to wait upwards of 20 seconds to respawn.”
I couldn’t believe this when I saw it in the store today…. they must have been saving these for a while :) I put this up there with the Alex Rodriguez “Man in the Mirror” photos…. Don’t these guys have handlers to help them from taking photos like this??? They’re in need of some LW Curators to get them out of these messes!!!
Last one I swear, also from Rev3′s site, original post here. Also will be at LW offices shortly, so swing on by :)
“Lenovo’s amazing Tablet/PC Hybrid brings a tablet and a PC together in an amazingly elegant way
It’s a tablet. It’s a notebook computer. This amazing technology marvel from Lenovo – shown at CES 2010 for the first time — combines an Apple-killing tablet with an amazing laptop computer!”
CES, what else can be said! Found this on Rev3′s site, check it out here. We’ll be getting one of these in the office shortly….
“Lenovo releases the S10-3t, a convertible netbook that swivels to become either a tablet or a laptop
Looking for a tablet that doubles as a real computer? Lenovo released another Apple iTablet killer at CES 2010, the S10-3t. The new gadget runs Windows 7 and twists to turn into a tablet, or a clamshell laptop. Built around Intel’s brand new Atom N470, it has enough power to run videos and most mainstream programs. And with the first multi-touch capacative screen on the Windows platform, it’s a great touch computer as well. You can pick it up for $4500, when it ships later in January.”
Found this on Revision 3′s site from the CES show, awesome!!! check it out here
“It’s Dell’s new slate, a concept model with a beautiful 5” screen. The handheld slate is based on Android – and includes Facebook, video playback and more.”