The color of the spry accordion tab image that you are using for your Web page's navigation can be changed to orange with the "Paint Bucket Tool" in Adobe Photoshop. When you set an image as the background of a Web page element, such as a spry accordion tab, you are referencing an image file that is stored on your Web server. This image can be edited in the same ways as any other image that you can open in Photoshop, which allows you to make changes to the image at any time.
Instructions
- 1Launch your Web editing program.
- 2Click "File" at the top of the window, click "Open" and then double-click the file containing the spry tab panels that you want to modify. If your Web editing program has a "Design" and a "Code" mode, select the "Code" option.
- 3Browse to the spry accordion tab element on your page, and then identify the CSS class associated with the element. For example, if your spry accordion tab HTML code is "<div class="mysprytab">," then the class would be "mysprytab."
- 4Scroll to the "<head>" section of your Web page that contains the CSS class for your spry tab. If your CSS is located on a separate CSS page, then you will need to open that CSS page to locate the CSS class information.
- 5Locate the "background-image" style of your CSS class, and then write down the file location and name of the file found there.
- 6Browse to the file identified by the "background-image" style.
- 7Right-click the file, click "Open With" and then click "Adobe Photoshop."
- 8Click the "Set Foreground Color" icon in the toolbox at the left side of the window, click your desired shade of orange and then click "OK."
- 9Click the "Paint Bucket Tool" in the toolbox at the left side of the window.
- 10Click anywhere on the image to change the current color to the orange color that you just selected.
- 11Click "File" at the top of the window, and then click "Save."
- 1
