Solved

SharePoint page not displaying image map properly

Posted on 2013-11-14
2
966 Views
Last Modified: 2013-11-20
I took an image in Photoshop and sliced it up and saved it for Web pages and got an .html file and folder of images.  In SP Designer I see the imager perfectly aligned but when I put the page in SharePoint some of the images are off a bit.

Difference between Designer on left and browser on right.
I've loaded the file through a Content Editor Web Part and I've copied the html code and pasted it directly in the html source for the page but neither will display the image correctly.  Is there anyway to fix this?  I've copied the source code for the page displayed and threw it into Dreamweaver and the image displays correctly.

I know I can make an image map with hotspots in Designer but all I want are hover-overs explaining changes to that area of our floor plan.  Without a link the tool tips weren't showing up.  I can try to add a link directly to the page so if someone clicks it by mistake then it will just bring them back to that page but I'm disappointed that the PS page I made won't display correctly in SP.

Anyone have an idea of what is going wrong with my page?  All replies are appreciated!!
0
Comment
Question by:HSI_guelph
2 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 500 total points
ID: 39649011
Hi,
which SharePoint version/edition?

I just can guess that a SharePoint built-in CSS / style / class is responsible for the different look.

Could you perhaps please :
- Check the HTML source of the page in SharePoint (so opening the page in IE and then right-mouse -> Show source) and compare it with the HTML you pasted into the content editor web part
- attach the HTML so that we have something to verify
- Explain the difference / structure of your image map - from the uploaded screenshot I just can see the purple line on top (looks like a link decoratrion or background style) - but not of how many images the map is created on - is it just one? I just can guess that it is based on two images (top/bottom) and there is no space/padding in between

Thanks.
Rainer
0
 

Author Closing Comment

by:HSI_guelph
ID: 39663659
I used an Image map and made hotspots in Designer and while I couldn't get each spot to highlight when hovered over, I got all of them to highlight when the image was hovered over.
0

Featured Post

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Last week I faced a strange issue recently, i have deployed SharePoint 2003 servers for one project and one of the requirements was to open SharePoint site from same server. when i was trying to open site from the same server i was getting authentic…
We had a requirement to extract data from a SharePoint 2010 Customer List into a CSV file and then place the CSV file into a directory on the network so that the file could be consumed by an AS400 system. I will share in Part 1 how to Extract the Da…
This Micro Tutorial will teach you how to censor certain areas of your screen. The example in this video will show a little boy's face being blurred. This will be demonstrated using Adobe Premiere Pro CS6.
Along with being a a promotional video for my three-day Annielytics Dashboard Seminor, this Micro Tutorial is an intro to Google Analytics API data.

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question