How to hide the dotted border outline on focused elements in HTML, using CSS

How to hide the dotted border outline on focused elements in HTML, using CSS
By LESSAN
Credits: http://www.lessanvaezi.com/how-to-hide-the-dotted-border-outline-on-focused-elements-in-html-using-css/

While working on a web application for data entry, I had to scour the net for a way to hide the dotted border that appears when an element is focused on a web page. Here are my findings.

First, the obligatory disclaimer – I do understand that the dotted border is for accessibility purposes and should be left in place under normal circumstances. However, in this case we already had a replacement in place – when an element receives focus it is styled differently, using a very distinct background color. And this applies to all elements, regardless of whether they were selected by mouse or keyboard. So the dotted border is redundant, and somewhat distracting.

To further clarify the question, these are the dotted borders I refer to:
and

While the solution needed to be usable across browsers, the target browsers where well defined – modern versions of Firefox and Chrome, and IE 7 or newer. I first came across this question on stackoverflow.com which pointed me to using outline:none. Then this one helped with Firefox compatibility. And then I saw this post which provides a number of different techniques.

I ended up using the following CSS, which seems to cover most bases. As I didn’t see this combination on other sites I thought I would post it myself. It doesn’t apply to the select element in Firefox and IE7. Testing was done on Windows XP.

 

/* hide the dotted lines around an element when it receives focus */
* { _noFocusLine: expression(this.hideFocus=true); } /* ie7 */
::-moz-focus-inner {border:0;} /* firefox */
:focus {outline:none;} /* ie8, chrome, etc */

EASY FFMPEG

http://www.ffmpeginstaller.com/download/
http://www.ffmpeginstaller.com/

ok. here is (hopefully) a nice simple set of instructions for recent converts.

1) open up your prefered command console. I use yakuake (absolutly amazing program, but you can also use konsole or any other equivalent)
2) sign in as the super user by typing in “su” (enter) then entering your root password when prompted.
3) then go to the directory (folder) where the .tar.gz file is located. for example if it is in your home folder type in “cd /home/” and hit enter
4) type in “tar -zxvf ” and hit enter this will extract the files and create a new directory (folder)
5) go into that folder using “cd ”
6) enter in “./configure” into the command line. this will configure the files. (answer any questions asked)
7) when that’s done enter in “make” into the console.
when that’s done enter in “make install”

And you’re all done!!!

If you’d like to move the folder you may, but don’t delete the folder because it comes in useful if you’d like to uninstall the program

sample PHP

apir!!!

Create a PHP web crawler or scraper in 5 minutes

Credits: http://vision-media.ca/resources/php/create-a-php-web-crawler-or-scraper-5-minutes

Utilizing the PHP programming language we show you how to create an infinitely extendable web crawler in under 5 minutes, collecting images and links.

The Crawler Framework

First we need to create the crawler class as follows:

<?php

class Crawler {

}

?>

We then will create methods to fetch the web pages markup, and to parse it for data that we are looking at collecting. The only public methods will be getMarkup() and get() as the parsing methods will generally be used privately for the crawler, however the visibility is set to protected since you never know who will want to extend its functionality.

<?php

class Crawler {

protected $markup = ”;

public function __construct($uri) {

}

public function getMarkup() {

}

public function get($type) {

}

protected function _get_images() {

}

protected function _get_links() {

}

}

?>

Fetching Site Markup

The constructor will accept a URI so we can instantiate it such as new Crawler(‘http://vision-media.ca&#8217;); which then will set our $markup property using PHP’s file_get_contents() function which fetches the sites markup.

<?php

public function __construct($uri) {

$this->markup = $this->getMarkup($uri);

}

public function getMarkup($uri) {

return file_get_contents($uri);

}

?>

Crawling The Markup For Data

Our get() method will accept a $type string which essentially will simply be used to invoke another method actually doing the processing. As you can see below we construct the method name as a string, then make sure it is available so now developers can utilize this simply by invoking $crawl->get(‘images’);

We set visibility for _get_images() and _get_links() to protected so that developers will use our public get() method rather than getting confused and trying to invoke them directly.

Each protected data collection method simply uses the PCRE (Perl Compatible Regular Expressions) function preg_match_all() in order to return all tags within the markup that are accepted using our patterns of /<img([^>]+)\/>/i and /<a([^>]+)\>(.*?)\<\/a\>/i. For more information on regular expressions visit http://en.wikipedia.org/wiki/Regular_expression

<?php

public function get($type) {

$method = “_get_{$type}”;

if (method_exists($this, $method)){

return call_user_method($method, $this);

}

}

protected function _get_images() {

if (!empty($this->markup)){

preg_match_all(‘/<img([^>]+)\/>/i’, $this->markup, $images);

return !empty($images[1]) ? $images[1] : FALSE;

}

}

protected function _get_links() {

if (!empty($this->markup)){

preg_match_all(‘/<a([^>]+)\>(.*?)\<\/a\>/i’, $this->markup, $links);

return !empty($links[1]) ? $links[1] : FALSE;

}

}

?>

Final PHP Web Crawler Code And Usage

<?php

class Crawler {

protected $markup = ”;

public function __construct($uri) {

$this->markup = $this->getMarkup($uri);

}

public function getMarkup($uri) {

return file_get_contents($uri);

}

public function get($type) {

$method = “_get_{$type}”;

if (method_exists($this, $method)){

return call_user_method($method, $this);

}

}

protected function _get_images() {

if (!empty($this->markup)){

preg_match_all(‘/<img([^>]+)\/>/i’, $this->markup, $images);

return !empty($images[1]) ? $images[1] : FALSE;

}

}

protected function _get_links() {

if (!empty($this->markup)){

preg_match_all(‘/<a([^>]+)\>(.*?)\<\/a\>/i’, $this->markup, $links);

return !empty($links[1]) ? $links[1] : FALSE;

}

}

}

a

$crawl = new Crawler(‘http://vision-media.ca&#8217;);

$images = $crawl->get(‘images’);

$links = $crawl->get(‘links’);

?>

Fix PNG transparency in IE 6

Author: Peter Cooper
Link : http://codesnippets.joyent.com/user/therad/tag/javascript#post681

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
var arVersion = navigator.appVersion.split(“MSIE”)
var version = parseFloat(arVersion[1])
if ((version >= 5.5) && (document.body.filters))
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == “PNG”)
{
var imgID = (img.id) ? “id='” + img.id + “‘ ” : “”
var imgClass = (img.className) ? “class='” + img.className + “‘ ” : “”
var imgTitle = (img.title) ? “title='” + img.title + “‘ ” : “title='” + img.alt + “‘ ”
var imgStyle = “display:inline-block;” + img.style.cssText
if (img.align == “left”) imgStyle = “float:left;” + imgStyle
if (img.align == “right”) imgStyle = “float:right;” + imgStyle
if (img.parentElement.href) imgStyle = “cursor:hand;” + imgStyle
var strNewHTML = “
img.outerHTML = strNewHTML
i = i-1
}
}
}
}
window.attachEvent(“onload”, correctPNG);

Install Flash Ubuntu Hardy Heron

Test Drive Flash Player 10 Beta in Ubuntu

Posted by Tom in software

Adobe has released the Flash Player 10 Beta simultaneously for Linux, Mac, and Windows. This version includes performance improvements, new 3D transformations, Adobe Pixel Bender filters, streaming video improvements, and new text layout capabilities.

Websites very likely won’t be taking advantage of these new features until the stable release is out, so Adobe has a page of demos you can try.

Two large complaints about Flash on Linux are fullscreen video and 64-bit support. Neither have been resolved in this release. Playback of fullscreen video (which causes low framerates and high CPU usage) seems to be only slightly improved. I have found that there is a general performance increase.

Flash Player 10 3D effect

If you want to try Flash Player 10 you can download and install it yourself, but here are some terminal commands that you can copy and paste to get going quickly:

  1. Remove your existing Flash plugin, if you have one installed. This command will remove Flash 9 if you installed it from Ubuntu’s repository:
    sudo apt-get remove flashplugin-nonfree
  2. Download and extract the Flash Player 10 Beta to your home directory:
    wget -O - http://download.macromedia.com/pub/labs/flashplayer10/flashplayer10_install_linux_051508.tar.gz | tar xz -C ~
  3. The user plugins folder may not exist yet, try to create it but ignore any errors if the directory already exists:
    mkdir ~/.mozilla/plugins/
  4. Copy the Flash plugin the the Firefox plugins directory to install it:
    cp ~/install_flash_player_10_linux/libflashplayer.so ~/.mozilla/plugins/libflashplayer.so
  5. Remove the directory that was downloaded (if you get a warning about deleting a write-protected file, press y and Enter to continue):
    rm -r ~/install_flash_player_10_linux

Restart Firefox to enable the new plugin.

And here’s how to uninstall it:

  1. Remove the new plugin:
    rm ~/.mozilla/plugins/libflashplayer.so
  2. Reinstall Flash 9 from the repositories (if you wish):
    sudo apt-get install flashplugin-nonfree

[update] I’ve been using the Flash 10 plugin for over a week now, and the only issue I’ve had is the occasional website that thinks my version of Flash is too old.

UBUNTU HARDY HERON MANUAL