Created
February 15, 2015 02:54
-
-
Save codewizard13/76fd716247badd6ecabc to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* ON-hover, red border on image div. On focus blur, | |
| pink Works with Google Images (as of 07/21/13). | |
| (Press F12 in your browser to see the results) | |
| @Creator: Eric Hepperle (CodeSlayer2010) | |
| @Date: 07/20/13 | |
| @Version: 1.0 | |
| @Purpose: Puts a fancy style on image results | |
| in Google Images. When you hover over an image in a | |
| Google Images search, that image will show a red | |
| border with a drop shadow. Each "visited" image | |
| (only works with hover because click will reset) | |
| will now retain a pink frame border. If you rehover | |
| a visited image the red border effects come back. | |
| Simple, but neat effect. :) | |
| @Usage: First do a Google Images search. Next, add jQuery to | |
| the page using jQuerify shortcut (Chrome) or FireQuery | |
| (Firefox). Then, paste this code into the browser's | |
| developer console and run it. If console gives an error | |
| try clicking the shield in the upper right of the address | |
| bar. | |
| @Updates: | |
| 07/20/13 | |
| 06:30 - Created initial code. | |
| 02/14/15 | |
| 18:44 - NOTE: Due to some new security issues called | |
| a "Man-In-The-Middle" attack (MITM) this | |
| code won't work as is with what is being called | |
| "Mixed Content". The workaround is to click the | |
| shield icon in the address bar and chose to allow | |
| "unsafe" content. | |
| */ | |
| console.clear(); | |
| images = $('div.rg_di'); | |
| //images.hover(function(){ | |
| $.each(images, function(i, v){ | |
| $(this).hover(function(){ | |
| $(this).css({ | |
| "background-color":"yellow", | |
| 'border':'solid red 6px', | |
| 'box-shadow':'8px 8px 5px #888' | |
| }); | |
| },function(){ | |
| $(this).css({ | |
| "background-color":"pink", | |
| "border":"solid pink 6px", | |
| 'box-shadow':'none' | |
| }); | |
| }); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment