(1) Function description
Click the Show connection in the page to animate a picture with the show () method, and execute a callback function in the method to change the border style of the picture, and hide the picture by using hide () when you click the displayed picture.
(2) Implementation code
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-type" Content="text/html; Charset=utf-8 " /><title>Untitled Document</title><script type="text/javascript" src="... /jquery-2.1.4.js "></script><style type="Text/css"> body{font-size:px} img{ Display:none; cursor:pointer} </style><script type="Text/javascript" >$( function(){$("a"). Click ( function(){ //Display connection$("img"). Show ( the, function(){$( This). CSS ("Border","Solid 1px #ccc"); }) }) $("img"). Click ( function(){$( This). Hide ( the); }) })</script></head><body> <a href="javascript:void (0)">Show</a> <img src="images/dezai.jpg" /></body></html>Animate the way it is slowly displayed
Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.
[JQ authoritative Guide] 18th day: Animate and Hide pictures with show () and Hide () method
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
