jQuery Tutorials – Hide/protect mailto: links from spam bots and email harvesters #3

May 4, 2014December 27, 2014 specktator

This entry is part 3 of 3 in the series Spambot Protection

Here is a jQuery snippet that can protect email addresses from email harvesters. All you need to do is to inlcude .mail class to your “mailto:” html links like the example below.

<a href="mailto:peter_[at]_example.com"> peter_[at]_example.com </a>

1	<a href="mailto:peter_[at]_example.com"> peter_[at]_example.com </a>

jQuery(document).ready(function(){
    mailtoellements = jQuery("a[href^='mailto:']");
    mailtoellements.each(function(item){
    mailto = jQuery(this).attr('href');
    jQuery(this).attr('href',mailto.replace(/_\[\at\]\_/gi,"@"));
    email = jQuery(this).html();
    jQuery(this).html(email.replace(/_\[\at\]\_/gi,"@"));
        });
    });

jQuery(document).ready(function(){

mailtoellements = jQuery("a[href^='mailto:']");

mailtoellements.each(function(item){

mailto = jQuery(this).attr('href');

jQuery(this).attr('href',mailto.replace(/_\[\at\]\_/gi,"@"));

email = jQuery(this).html();

jQuery(this).html(email.replace(/_\[\at\]\_/gi,"@"));

});

line 2: Gather all the elements with the matched criteria line 3: Iterate on these elements line 4: on each […]

jQuery Tutorials – Hide/protect mailto: links from spam bots and email harvesters #2

March 4, 2014April 18, 2016 specktator

This entry is part 2 of 3 in the series Spambot Protection

Here is a jQuery snippet that can protect email addresses from email harvesters. All you need to do is to inlcude .mail class to your “mailto:” html links like the example below.

<a href="mailto:peter_[at]_example.com" class="mail"> peter_[at]_example.com </a>

1	<a href="mailto:peter_[at]_example.com" class="mail"> peter_[at]_example.com </a>

$(document).ready(function(){
mailto = $("a[href^='mailto:']").attr('href');
$("a[href^='mailto:']").attr('href',mailto.replace(/_\[\at\]\_/gi,"@"));
email = $('.mail').html();
$('.mail').html(email.replace(/_\[\at\]\_/gi,"@"));
});

$(document).ready(function(){

mailto = $("a[href^='mailto:']").attr('href');

$("a[href^='mailto:']").attr('href',mailto.replace(/_\[\at\]\_/gi,"@"));

email = $('.mail').html();

$('.mail').html(email.replace(/_\[\at\]\_/gi,"@"));

});

Geeks are sexy… :D @specktator

[Updated] WordPress Essential Plugins

February 26, 2014December 27, 2014 specktator

This is my list with the most essential wordpress CMS plug-ins. In order to find and install these plugins, you can directly search them in WordPress plugin search engine. If I missed something please drop me a line to update the post. Security: UPDATE (26/12/2014) iThemes security (malware scanning via virus total, wp-admin url hiding […]

JQuery Tutorials -JQuery Wildcard Selectors

November 13, 2012December 27, 2014 specktator

<strong>JQuery</strong> is a Javascript Framework used in most of www websites. Providing easing effects, code manipulation, easy <strong>ellement <a href="http://api.jquery.com/category/selectors/" target="_blank">selectors</a></strong> and some other great stuff!
Personally is my favourite framework and i use it in most of my "web coding" cases.

I've been looking for <strong>wildcard</strong> ellement selection in <strong>JQuery</strong> framework and finally i've realized that <a href="http://jquery.com/" target="_blank">JQuery</a> uses <a href="http://en.wikipedia.org/wiki/Regular_expression" target="_blank"><strong>regular expressions</strong></a> in DOM (Document Object model).

<kbd>For example</kbd>
<kbd></kbd>
[crayon-678ef95e0b105702122006 lang="js" ]$("#divEllement").html();

JQuery is a Javascript Framework used in most of www websites. Providing easing effects, code manipulation, easy ellement <a href="http://api.jquery.com/category/selectors/" target="_blank">selectors</a> and some other great stuff!

Personally is my favourite framework and i use it in most of my "web coding" cases.

I've been looking for wildcard ellement selection in JQuery framework and finally i've realized that <a href="http://jquery.com/" target="_blank">JQuery</a> uses <a href="http://en.wikipedia.org/wiki/Regular_expression" target="_blank">regular expressions</a> in DOM (Document Object model).

<kbd>For example</kbd>

[crayon-678ef95e0b105702122006 lang="js" ]$("#divEllement").html();

So for wildcards this can be done.

$("#Ellem\\S*").each();

1	$("#Ellem\\S*").each();

Update: I’ve discovered that is not usable in some cases. In case you are really in trouble, you can use

$('div[id^=Ellement]:visible').something

1	$('div[id^=Ellement]:visible').something

This will work in any of these “Ellement1″,”Ellement2″,”EllementSomething” cases.[/crayon]

PS
If anyone has a better way for this, don't hesistate to mail me.

1 2	PS If anyone has a better way for this, don't hesistate to mail me.

Google Gmail – How to change gmail default font settings

November 13, 2012December 27, 2014 specktator

Gmail has many features as it is but there are a lot more at <strong>labs</strong>! So this tutorial deals with <strong>gmail</strong> and <strong>labs</strong>. I've found something that helped a lot... Default text style function.

1. Open your gmail

2. Click on right top, settings icon, and choose <strong>mail settings</strong>

3. Select <strong>labs</strong> tab

4. search for <strong>Default Text Styling </strong>by Jonathan K.

5. Select <strong>enable</strong>

6. Go to bottom of the page and <strong>save</strong>.

7. When gmail reloads go again to <strong>mail settings</strong> 

8. By default you are on by <strong>General</strong> tab. find <strong>Default text Style</strong>

9. Choose your new <strong>Default text Style</strong>

10. Scroll down to bottom again and <strong>Save</strong> your settings.

Done!

Gmail has many features as it is but there are a lot more at labs! So this tutorial deals with gmail and labs. I've found something that helped a lot... Default text style function.

1. Open your gmail

2. Click on right top, settings icon, and choose mail settings

3. Select labs tab

4. search for Default Text Styling by Jonathan K.

5. Select enable

6. Go to bottom of the page and save.

7. When gmail reloads go again to mail settings

8. By default you are on by General tab. find Default text Style

9. Choose your new Default text Style

10. Scroll down to bottom again and Save your settings.

Done!

JQuery Tutorials – Use JQuery to protect/rewrite emails from spam bots

November 13, 2012March 4, 2014 specktator

This entry is part 1 of 3 in the series Spambot Protection

This jquery snippet protects your published email addresses from being obtained from spam bots. Keep in mind that your (html)code must be in form Peter_[at]_example.com and the emails must be inside an ellement with mail class in order to let javascript replace the correct characters. Of course you can modify it as you wish ;) […]

JQuery tooltips – 6 plugins to easilly create tooltips

January 22, 2012March 13, 2014 specktator

Tooltips are used to save space in website layout design. If they are used properly then the page becomes much friendlier to our users. <a href="http://jquery.com/">JQuery</a> is a cross-browsing javasript library which gives us the ability to do things in 2-3 lines of code. Search the below Jquery plugins to find what fits to your needs. <em>Remember not to flood your site with so much tooltips. That will drag out of the website your users.</em>

<em><strong><a href="http://craigsworks.com/projects/qtip/" target="_blank">1. qTip</a></strong></em> qTip has an advance tooltip plugin with a lot of features like speech-like clouds, rounded corners and more.

Tooltips are used to save space in website layout design. If they are used properly then the page becomes much friendlier to our users. <a href="http://jquery.com/">JQuery</a> is a cross-browsing javasript library which gives us the ability to do things in 2-3 lines of code. Search the below Jquery plugins to find what fits to your needs. Remember not to flood your site with so much tooltips. That will drag out of the website your users.

<a href="http://craigsworks.com/projects/qtip/" target="_blank">1. qTip</a> qTip has an advance tooltip plugin with a lot of features like speech-like clouds, rounded corners and more.

<strong><em>2. jQuery Tools/Tooltips</em></strong> This tooltip plugin can contains any HTML element such as links, table, forms, and images. Implementing this plugin is very easy. The default effects are sliceup and toogle. However, you can easily build your own effects.
<a href="https://totallynoob.comwp-content/uploads/2013/01/jquery-tools-tooltips.png"><img class="alignnone size-full wp-image-686" title="jquery-tools-tooltips" src="https://totallynoob.comwp-content/uploads/2013/01/jquery-tools-tooltips.png" alt="" width="500" height="132" /></a>

<strong><em><a href="http://craigsworks.com/projects/simpletip/" target="_blank">3. Simpletip</a></em></strong> Simpletip allows you to create tooltips with ease on any element on the page using the power of jQuery.The tooltips can be static, dynamic, or even loaded through AJAX with a variety of different visual effects.

<a href="https://totallynoob.comwp-content/uploads/2013/01/simpletip.png"><img class="alignnone size-full wp-image-687" title="simpletip" src="https://totallynoob.comwp-content/uploads/2013/01/simpletip.png" alt="" width="343" height="129" /></a>

<strong><em>4. Orbital Tooltip</em></strong> With the Orbital Tooltip you can choose to position the tooltip on any object in a 360 degrees around it.
<a href="https://totallynoob.comwp-content/uploads/2013/01/orbital-tooltip.png"><img class="alignnone size-full wp-image-688" title="orbital-tooltip" src="https://totallynoob.comwp-content/uploads/2013/01/orbital-tooltip.png" alt="" width="500" height="178" /></a>

<strong><em><a href="http://onehackoranother.com/projects/jquery/tipsy/" target="_blank">5. Tipsy</a></em></strong> A simple tooltip based on anchor tag's title. In my opinion this simplicity will provide alternative info for an ellement while not stressing visitors eyes with colors,effects etc.

<a href="https://totallynoob.comwp-content/uploads/2013/01/tipsy.png"><img class="alignnone size-full wp-image-689" title="tipsy" src="https://totallynoob.comwp-content/uploads/2013/01/tipsy.png" alt="" width="500" height="70" /></a>

<em><strong><a href="http://nicolae.namolovan.googlepages.com/jquery.inputHintBox.html">6. jQuery Input Floating Hint Box</a></strong></em> It provides an automatic box hint in the right side of an input, when focus on that input, and disappear when focus go (blur).

2. jQuery Tools/Tooltips This tooltip plugin can contains any HTML element such as links, table, forms, and images. Implementing this plugin is very easy. The default effects are sliceup and toogle. However, you can easily build your own effects.

<a href="http://craigsworks.com/projects/simpletip/" target="_blank">3. Simpletip</a> Simpletip allows you to create tooltips with ease on any element on the page using the power of jQuery.The tooltips can be static, dynamic, or even loaded through AJAX with a variety of different visual effects.

4. Orbital Tooltip With the Orbital Tooltip you can choose to position the tooltip on any object in a 360 degrees around it.

<a href="http://onehackoranother.com/projects/jquery/tipsy/" target="_blank">5. Tipsy</a> A simple tooltip based on anchor tag's title. In my opinion this simplicity will provide alternative info for an ellement while not stressing visitors eyes with colors,effects etc.

<a href="http://nicolae.namolovan.googlepages.com/jquery.inputHintBox.html">6. jQuery Input Floating Hint Box</a> It provides an automatic box hint in the right side of an input, when focus on that input, and disappear when focus go (blur).

Reveal Password From Input Boxes With Chrome Tools

May 22, 2011December 3, 2015 specktator

In this tutorial I will show you how to reveal password characters (asterisks) from a html input form, with Google Chrome Developer Tools. This is a very simple hack with Google Chrome don’t freak out. It’s so easy. Update: I noticed some forum threads from backlinking. Guys, this is absolutely normal. It cannot be remotely […]

totallynoob.com

noobs are humans too

Category: Programming

jQuery Tutorials – Hide/protect mailto: links from spam bots and email harvesters #3

jQuery Tutorials – Hide/protect mailto: links from spam bots and email harvesters #2

[Updated] WordPress Essential Plugins

JQuery Tutorials -JQuery Wildcard Selectors

Google Gmail – How to change gmail default font settings

JQuery Tutorials – Use JQuery to protect/rewrite emails from spam bots

JQuery tooltips – 6 plugins to easilly create tooltips

Reveal Password From Input Boxes With Chrome Tools

Hey!

It looks like you’re enjoying our content!

Coupon Code 10% OFF: pirate_jerseys

Get yours Now!

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Thanks for reading! If you enjoyed this article, share it!! It makes me happier.

Hey!

It looks like you’re enjoying our content!

Coupon Code 10% OFF: pirate_jerseys