JavaScript: Automatically make all the external links with rel=”nofollow noopener noreferrer”

JavaScript: Automatically make all the external links with rel=”nofollow noopener noreferrer”

Nov 15, 2019 | JavaScript | 0 comments

The rel attribute specifies the relationship between the current document and the linked document. Search engines can use this attribute to get more information about a link.

rel Attribute Values

nofollowLinks to an unendorsed document, like a paid link.
(“nofollow” is used by Google, to specify that the Google search spider should not follow that link)
noreferrerRequires that the browser should not send an HTTP referer header if the user follows the hyperlink
noopenerRequires that any browsing context created by following the hyperlink must not have an opener browsing context

Add the following code into your HTML page between the <head> and </head> tags or before the closing </body> tag

<script>
    document.addEventListener('DOMContentLoaded', function () {
        var links = document.getElementsByTagName("a");
        var i;
        for (i = 0; i < links.length; i++) {
            if (location.hostname !== links[i].hostname) {
                links[i].rel = "nofollow noopener noreferrer";
                links[i].target = "_blank";
            }
        }
    });
</script>

Javescript/Jquery Error: f.easing[e.animatedProperties[this.prop]] is not a function

Nov 16, 2012 | jQuery | 0 comments

Error: f.easing[e.animatedProperties[this.prop]] is not a function

Error: f.easing[e.animatedProperties[this.prop]] is not a function

This problem happens with jQuery Easing Plugin. This error occurs when a newer version of jquery and jquery.easing is used with an older version of the call to animate.easing.

Solution:
Use the following jQuery, JQuery Easing and JQuery Easing Compatibility
Download JQuery – Latest version from JQuery

Download JQuery – Version 1.5.2 hosted at Google

JQuery Easing Plugin – Version 1.3 by George McGinley Smith

JQuery Easing Compatibility (for use with older versions) – by George McGinley Smith

jQuery: How to add ‘onchange’ attribute in a ‘select’ tag?

Oct 1, 2012 | jQuery | 0 comments

<select id="sel_id">
</select>

Works for me if I use the native setAttribute().

Also, remember that you need quotes around the selector.

$("#sel_id")[0].setAttribute("onchange", "foo()");

the final html will be

<select id="sel_id" onchange="foo();" >
</select>

Also remember to define foo in the global namespace, and not inside jQuery’s .ready() function.

Source:
http://stackoverflow.com/a/3638016

Javascript: Making the entire div clickable

Oct 1, 2012 | JavaScript | 0 comments

We could make an entire div tag clickable by redirecting the click to a page and by changing the cursor sytle to a pointer. This is good if you want your logo or your banner to be clickable, specially if the logo is embedded together with the banner. Making the entire banner clickable would be very beneficial to your site.

<div onclick="location.href='http://www.tildemark.com/';" style="cursor: pointer;">
</div>

Source:
http://www.tildemark.com/making-the-entire-div-clickable/

jQuery: Append a CSS class to any item or last item

Aug 28, 2012 | jQuery | 0 comments

<script type="text/javascript">
	jQuery("p:last").addClass(" last");
</script>

It’s important to note that this method does not replace a class. It simply adds the class, appending it to any which may already be assigned to the elements.

More than one class may be added at a time, separated by a space, to the set of matched elements, like so:

$("p").addClass("myClass yourClass");

(more…)

JavaScript: How to change text value in an input box?

Aug 28, 2012 | JavaScript | 1 comment

<form name='yourForm' action="">
     <input type='text' name='yourinput' id='yourinput' value='Hello World'>
</form>

<script type="text/javascript"> 
// Assign the value to the input with the id passed in 
function replaceInputValue( idRef, val ) { 
	// Make sure browser supports getElementById  
	if(!document.getElementById ) return; 
	// Find the input by it's id 
	var inputObj = document.getElementById( idRef ); 
	if( inputObj ) { 
	// Update the value 
	inputObj.value = val; 
	}
}
replaceInputValue( 'yourinput', 'Hello Dolly' );
</script>

jQuery: Even and odd classes for series of divs

Aug 28, 2012 | JavaScript, jQuery | 0 comments

<html>
	<head>
		<style>
			.odd {
				height: 5px;
				background: #960;
			}
			.even {
				height: 5px;
				background: #09C;
			}
		</style>
		<script src="js/jquery-1.7.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$('div:odd').addClass('odd');
				$('div:even').addClass('even');
			})
		</script>
	</head>
	<body>
		<div></div>
		<div></div>
		<div></div>
		<div></div>
		<div></div>
	</body>
<html>

SqueezeBox – Expandable Lightbox (v1.1)

Nov 30, 2011 | AJAX, JavaScript | 0 comments

SqueezeBox is an unobtrusive LightBox inspired overlay, for modal boxed content on your site. It’s a snap to show images but just as easy to use HTML elements, Ajax requests, iFrames, SWF movies and more.

Source: http://digitarald.de/project/squeezebox/

MySQL Search & Replace Tool

Nov 21, 2011 | JavaScript | 0 comments

This web-based tool written in PHP makes it easy to search and replace text strings in a MySQL database.

Source: http://sewmyheadon.com/2009/mysql-search-replace-tool/