XRAY is a free cross browser software to see properties of any element on a webpage. This tool is a simple bookmarklet, that resides quietly on bookmark bar of your browser. When you need to test any element on the webpage, you can click on the bookmarklet, and then select the element on the webpage. It provides you the details, like: Element, ID, Class, Positions, Borders, Margins, etc. So, to see properties of any element on a webpage, you can use this bookmarklet.
Developers need not to worry about about the the browsers as well. You can have this bookmarklet on almost all commonly used browsers, like: Internet Explorer (6+), Google Chrome, Firefox, Safari, etc.
It works well for all types of the elements, like: text, images, videos, links, etc. But the best part of this tool is that it takes only a couple of clicks to provide the details of the elements. You can use the link available at the end of this review to to reach the homepage of XRAY. Then you just need to drag the “XRAY” bookmarklet to the bookmark bar of your browser.
I tested this bookmarklet on Google Chrome, Internet Explorer, and Firefox, and it worked fine for all of them.
How to Use XRAY Bookmarklet To See Properties of Elements on Webpage?
Using this XRAY is very simple. First you need to open the webpage from which you want to see properties of elements. Then click on the bookmarklet, and it will open a dialogue box, that will ask you to click on the element that you want to test.
Click on the element and a small XRAY window will let you know about element details:
- Element provides the type of the element, like: paragraph, image, video, etc.
- ID of the element
- Class of the element
- Inheritance hierarchy will use the the arrow keys to present element’s parent, siblings, or children.
- Position will provide the position of element on the page and details of its height, width, float, etc.
- Border presents the border details for top, bottom, right, and left corners separately.
- Margins from the all four sides is given.
- Padding is also given for all the four corners.
You can again click on any other element and test it properties.
My Opinion on XRAY:
XRAY bookmarklet is designed to analyze one element at a time and is pretty good at it. It is very simple and easy to use. It works separately for different tabs. If you are testing any element on one tab, you can still keep surfing on other tabs normally.
It works for all commonly used browsers. Being just a bookmarklet, you don’t need to install it and easily add it to any browser.