Solved

SharePoint page not displaying image map properly

Posted on 2013-11-14
2
931 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

Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

Join & Write a Comment

Note:  There are two main ways to deploy InfoPath forms:  Server-side and directly through the SharePoint site.  Deploying a server-side InfoPath form means the form is approved by the Administrator, thus allowing greater functionality in the form. …
If you create your solutions on SharePoint sooner or later you will come upon a request to set  permissions of the item depending on some of the item's meta-data - the author, people assigned as approvers, divisions, categories etc. The most natu…
Access reports are powerful and flexible. Learn how to create a query and then a grouped report using the wizard. Modify the report design after the wizard is done to make it look better. There will be another video to explain how to put the final p…
This video shows how to remove a single email address from the Outlook 2010 Auto Suggestion memory. NOTE: For Outlook 2016 and 2013 perform the exact same steps. Open a new email: Click the New email button in Outlook. Start typing the address: …

706 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

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now