Skip to content

kssfilo/jquery.showimgalt

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

#jquery.showimgalt

jQuery plugin to show alt attribute in img elements by inserting text after the img.

##Download

##Usage

<html>
	<head>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script src='jquery.showimgalt.js' ></script>

		<script>
			$(document).ready(function(){
				$('img').showImgAlt();
			});
		</script>
	</head>

	<body>
		<img src='flower.jpg' alt='a beautiful flower'></img>
	</body>
</html>

results

	<img src='flower.jpg' alt='a beautiful flower'></img>
	<span class='imgalt'>a beautiful flower</span>

##Options

$('img').showImgAlt({before:true});   //inserts before img element
$('img').showImgAlt({tag:'<figcaption>'});     //uses figcaption element instead of span
$('img').showImgAlt({class:'someclass'});  //sets class to someclass,default is imgalt

##Another Usage for HTML5

<html>
	<head>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script src='jquery.showimgalt.js' ></script>

		<script>
			$(document).ready(function(){
				$('figure img').showImgAlt({tag:'<figcaption>'});
			});
		</script>
	</head>

	<body>
		<figure>
			<img src='flower.jpg' alt='a beautiful flower'></img>
		</figure>
	</body>
</html>

###results

	<figure>
		<img src='flower.jpg' alt='a beautiful flower'></img>
		<figcaption class='imgalt'>a beautiful flower</figcaption>
	</figure>

About

jQuery plugin to show alt attribute in img elements by inserting text after the img.

Resources

License

Stars

Watchers

Forks

Packages

No packages published