Adding text to "on mouse" image boxes

Even when I'm scared. After completing the following web page, I thought that it might be preferable to have a line of explanatory text for each image displayed as the menu drop-down is "rolled" on...

Screen Shot 2012-05-15 at 17.30.23.jpg

Each of the items in the menu on the right shows an alternate image and for the life of me I don't see where to add a simple line or two of text either go under or to the right of the image (if I move the images to the left!)

Someone at - there a way to add text? I see that you can add text in the "behaviours" - this is where I should go?

The code below for this area of the page:

CSS:

{#imageview}

height: 476px;

Width: 476px;

position: relative;

left: 138px;

top: 30px;

float: left;

background-repeat: no-repeat;

background-position: Center;

}

HTML:

< body = onload "MM_preloadImages (" Images/services_adverts.jpg','Images/services_brochures.jpg','I mages/services_carto.jpg','Images/services_catalogues.jpg','Images/services_destoprint.jpg', 'Images/services_digiIllustrate.jpg','Images/services_branding.jpg','Images/services_pac kaging.jpg','Images/services_reports.jpg','Images/services_digiretouch.jpg','Images/servic es_techmanuals.jpg','Images/services_webdesign.jpg' ") ' >

< div id = 'wrapper' >

< div id = "header Panel" > < img src = "Images/handprint_panel.jpg" alt = "header" width = "960" height = "190" border = '0' well = "#Map" / > "

< ul id = "MenuBar1" class = "MenuBarHorizontal" >

< li > < a class = "MenuBarItemSubmenu" href = "#" > SERVICES < /a >

< ul class = "stay" >

< li onmouseover = "MM_swapImage (" Image1', "," Images/services_adverts.jpg', 1 ")" > < a href = "#" > advertising < /a > < /li > ""

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_brochures.jpg', 1 ")" MM_swapImgRestore "> brochure < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_carto.jpg', 1 ")" MM_swapImgRestore "> mapping < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_catalogues.jpg', 1 ")" MM_swapImgRestore "> catalogues < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_destoprint.jpg', 1 ")" MM_swapImgRestore "> < /li > < /a > print design

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_digiIllustrate.jpg', 1 ")" MM_swapImgRestore "> example < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_branding.jpg', 1 ")" MM_swapImgRestore "> logos and brand < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_packaging.jpg', 1 ")" MM_swapImgRestore "> packaging < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_reports.jpg', 1 ")" MM_swapImgRestore "> reports < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_digiretouch.jpg', 1 ")" MM_swapImgRestore "> editing < /a > < /li >

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_techmanuals.jpg', 1 ")" MM_swapImgRestore "> < /a > < /li > technical manuals

< li > < a href = "#" onmouseover = "MM_swapImage (" Image1', "," Images/services_webdesign.jpg', 1 ")" MM_swapImgRestore "> Webdesign < /a > < /li >

< /ul >

< /li >

< li > < a href = "contact.html" > CONTACT < /a > < /li > ""

< li > < a href = "history.html" > STORY < /a > < /li > ""

< li > < a href = "profile.html" > PROFILE < /a > < /li > "

< li > < a href = "index.html" > HOME < /a > < /li >

< div id = "imageview" > < img src = "Images/services_adverts.jpg" width = "440" height = "440" border = "18" id = "Image1" / > "

< / div >

It works very well already, and I really appreciate being able to understand a text! To add a separate div for each alternate/rollover image box change so how can I associate said div with the onmouseout/onmmouse...

More you gurus!

Change «services order page»

  • to as below:

  • ordering page services
  • Tags: Dreamweaver

    Similar Questions

    • Is there an easy way to create "the mouse on the text, to display the image" without coding it? I want an image to appear only when you move to a line of text. I found the code for it but I want to find an easier way. Thank you!

      Is there an easy way to create "the mouse on the text, to display the image" without coding it? I want an image to appear only when you move to a line of text. I found the code for it but I want to find an easier way. I'm creating a home page with a list of text links. I want to design as well as in the overview of one of the text links, a corresponding image is displayed to the right of the page. I also need a default image to rest all the time unless one of the other links text is hovered over. Thank you!

      Try to use a Widget for Composition in the Adobe Muse Widgets Panel.

      I would like to start with a blank publication.

      Place your text in the button area.

      Place your image in the display area.

    • How to convert a PDF file that contains an image (picture) with added text typewriter (numbers next to faces) in a JPEG file?

      I'm trying to convert a PDF to JPEG.  The PDF file contains a picture JPG (photo of a group of people) which I added text (numbers next to each face) using the Acrobat typewriter function.  When I use Save as and select JPEG saved file does not contain the added text.  I tried to export the file and got the same results.  Is it possible to save the PDF modified with the addition of text to a new JPEG file?

      Hi jackh46691612,

      Simply fill out the PDF using the Adobe PDF printer, make sure that you have selected "Document & annotations" in the dialog box to print before printing to the Adobe PDF printer.

      Kind regards

      Nicos

    • added text to an image using the ImageDrawText function

      I added text to an image using the ImageDrawText function

      My requirment is i wnt to change the color of text in red... .How can I?

      < cfset attr = StructNew() >
      < cfset attr.underline = "yes" >
      < cfset attr.size = 25 >
      < cfset attr.style = "bold" >

      < cfset x = 0 >
      < cfset x = 50 >
      < cfset text1 = "the position of the image is represented by (x, y).»  Each coordinates multiply with higher ratio to adjust the image. ">

      < cfset ImageDrawText (myImage1, Text1, 0, 50, attr) >

      The docs (the page I pointed you) indicate it was added in CF8.  It does not work in CF8?

      --

      Adam

    • Deletion of added text

      I opened the paint when you view a picture and added text to the image.  Then, I saved the image.  Now, I want to remove the text.  I can't click on the text box to remove the text.  Someone at - he found a way to remove the text in the paint?

      This is because once the file is saved the text in the area is part of the image, it is only a layer separated during the editing session.

      Painting is a relative simple image editing tool, save the editing as separate not process or don't create undo functions that survive to the record. Once you do this generate you a complete picture and revised to replace the original, unless you use the function Save as and save it under a different file name.

    • The device icon and text missing in the imaging devices Manager

      The device icon and text missing in the imaging devices Manager

      I'm running MS Vista Ultimate.

      The imaging device icon and the wording are missing in Device Manager are missing. A device is listed in the box as installed missing icon.

      The other devices in Device Manager normally appear and I can compare what is supposed to be there for another computer running the same version of windows.

      However, the device will not work and will not reinstall.

      When you try to reinstall the device an error indicates that Setup does not work and to contact the manufacturer of the device.

      Yet once, however, this happens when I try to install any imaging device.

      I'm unable to locate information about the imaging devices in the registry.

      I think that some registry entries are missing.

      It is not the missing peripheral individual. This is the section in Device Manager.

      The image error is logged:

      "Windows didn't load setup." Contact your hardware vendor. »

      This happens with any device inaging of anyone.

      Hi henrymullersr

      What imaging device do you use?

      We can try a few steps and check if it helps you.

      Try to run the hardware and devices Troubleshooter: http://windows.microsoft.com/en-US/windows7/Open-the-Hardware-and-Devices-troubleshooter

      If the result of the Troubleshoot utility is negative, then reinstall the device. And also be sure to uninstall the previous contents of the device driver by running utility windows install cleanup:

      http://download.Microsoft.com/download/e/9/d/e9d80355-7ab4-45b8-80e8-983a48d5e1bd/msicuu2.exe

      Now follow the following steps:

      1. Save the Windows Installer Cleanup Utility package on your computer

      2. right click on the Windows Installer Cleanup Utility and run as administrator

      3. follow you prompt in the installation wizard. Once completed the installation, click on the Start button

      4. click on all programs. Click on Windows Install CleanUp Utility.

      5. click on the device driver (if on list) in the list of programs.

      6. click on Remove. Click OK

      7. click exit

      Restart the computer for the changes to take effect
       
      Then try to install the device driver and check the result: http://windows.microsoft.com/en-US/windows-vista/Install-a-USB-device

      After back and let us know if it helped to solve your problem.

      Thank you and best regards,

      R uma - Microsoft technical support.

      Visit our Microsoft answers feedback Forum and let us know what you think.

    • My added texts and comments will not print on the .pdf more.  Did turn something off accidentally?

      The text that I added a file .pdf (& sometimes comment boxes) appear not when I print the .pdf.  He is used to.  Same thing with stamps, they are not printed on the document and they used to.  Do you have a something accidentally disabled?  I have Adobe Acrobat XI Standard.

      In the print dialog box, choose "Document and brands."

    • Why the font size is so great when adding text to the photo in high resolution?

      Why the font size is so great when adding text to the photo in high resolution?

      Font size is usually determined by the size in points. 72 points equal to 1 inch. the size is independent of the size of your actual file. You might have a file that is located at 72 dpi, which is set to a 5 X 7 "and the police would be the size even if it is a 1200 dpi image 5 X 7.

    • Question on text overlay on an image

      Hi - I'm trying to place a layer of text on a ghost image that I imported into ID of Photoshop.  I mean by 'ghost' image has a fill layer white which has been set at 50% opacity.  ID let not text be layered on top of the imported image, regardless of how many different ways I tried to achieve.  It will allow another image to be superimposed on top of text.  If I place a text block on the letter of even an image and the ghost, the red warning icon type overset text is displayed.

      I tried to apply the text in Photoshop and that works very well until the file is imported in ID, how the text looks awful, which is somehow degraded in transit.  I'm relatively new to the ID and the PS and would appreciate any useful input.

      Thank you!

      ~ Artemis

      It seems that the dressing is applied to the image or the image above, or both. Eihter disable it if you don't need it for other reasons, or for the image that you want to use on top of it, open the Options of text block and check the box ignore the skin in the lower left corner.

    • Adding text to PDF using iText instead of CFPDF

      Hello

      I know this may seem a bit off-topic is posted here, but I ask this Council because I am a complete JAVA noob and I guess some of you folk CF could do that before.

      In any case, on my question... I'm already add a watermark image to a PDF using iText (CF8) with the help of colleagues poster (= cfSearching =).  I'm looking for is the best way to go about adding text to the same pdf.  I have to add 4 lines of text (with specific font and size) and Center it under the image being added.   Someone at - it a site they could tell me how to add text in the form and how do I get the width of this text to align properly?  I have search Google and watched a lot of JAVA code but be a noob JAVA, it's hard to know exactly what libs and methods you can use to do this.

      Any help would be greatly appreciated!

      -Michael

      The classes you need are PdfTable and PdfCell

      http://cfsearching.blogspot.com/2008/09/getting-started-with-iText-tables.html

      I was curious, I threw together a rough example. It adds the table in a pdfTemplate, then the model adds watermark to each page. The positioning and table dimensions are based on my sample data, so you'll need to tweak the.  Make sure that the dimensions of the model are large enough to accommodate your image and your text. If the dimensions are not large enough, the watermark is perhaps not visible.


      Err = "";
      TEST VALUES
      maxlinechars = 40;
      dCompany = "Google Inc.";
      dnom = "1600 Amphitheatre Parkway";
      dPhone = '+ 1 650-253-0000';
      dEmail = "[email protected]";
         
      simplify the code by putting the watermark text values in a table
      TextElement = [dCompany, dName, dPhone, dEmail];
      inputFile = ExpandPath ("ChapterSection.pdf");
      outputFile = ExpandPath ("ChapterSection_Watermark_ImageWithText.pdf");
      imgPath = ExpandPath("/dev/beveled_purpleblue.png");

      try {}
      initialize objects to read and write the pdf file
      pdfReader is createObject ("java", "com.lowagie.text.pdf.PdfReader") .init (inputFile);.
      outStream is createObject ("java", "java.io.FileOutputStream") .init (outputFile);.
      pdfStamper is createObject ("java", "com.lowagie.text.pdf.PdfStamper") .init (pdfReader, outStream);.

      get the size of the watermark image
      Note: table width and height are examples of values for demo only...
      Watch to your dimensions are large enough to accomdate your text and image
      otherwise the watermark is perhaps not entirely visible
      IMG is createObject ("java", "com.lowagie.text.Image") .getInstance (imgPath);.
      tableWidth = img.width () + 100;
      tableHeight = img.height () + 75;
             
      create a template for the table storage
      CB = pdfStamper.getOverContent (1);
      model = cb.createTemplate (tableHeight, tableWidth);

      create a single-column table
      table = createObject ("java", "com.lowagie.text.pdf.PdfPTable") .init (1);
      table.setTotalWidth (tableWidth);

      reusable objects for adding rows in the table
      PdfCell = createObject ("java", "com.lowagie.text.pdf.PdfPCell");
      Expression = createObject ("java", "com.lowagie.text.Phrase");

      Add the watermark image to the first line
      imageCell = PdfCell.init (img, false);
      imageCell.setBorder (PdfCell.NO_BORDER);
      imageCell.setHorizontalAlignment (PdfCell.ALIGN_CENTER);
      table.addCell (imageCell);

      Add each piece of text in the table of a new line
      for (x = 1; x<= arraylen(textelements);="" x++)="">
      textCell = PdfCell.init (Phrase.init (TextElement [x]));
      textCell.setBorder (PdfCell.NO_BORDER);
      textCell.setHorizontalAlignment (PdfCell.ALIGN_CENTER);
      table.addCell (textCell);
      }
             
      get the calculated height of table
      table.calculateHeightsFast ();
      tableHeight = table.getTotalHeight ();
      table.writeSelectedRows (0, - 1, 0, tableHeight, model);
      WriteOutput ("calculated tableWidth =" tableWidth & ", tableHeight =" "& tableHeight &")
      ");

      Add model watermark to each page
      Note: x / yPos values are for demo only (in upper right)...
      i = 0;
      totalPages = pdfReader.getNumberOfPages ();
      so that {(i LT totalPages)
      i = i + 1;
      content = pdfStamper.getOverContent (javacast ("int", i));
      positioning of arbitrary code
      pageSize = pdfReader.getPageSize (i);
      yPos = pageSize.height () - tableHeight - 15;
      PosX = (pageSize.width () - tableWidth)-25;
      content.addTemplate (template, xPos, yPos);
      WriteOutput ("watermarked page" & I & "xPos =" & xPos & ", yPos =" "& yPos &")
      ");
      }
      }
      catch (Exception e) {}
      ERR = e;
      }
      If (IsDefined ("pdfStamper")) {}
      pdfStamper.close ();
      }

      If (IsDefined ("outStream"))
      {
      outStream.close ();
      }

    • using text to swap an image (disjoint overview)

      Hello

      I have a text on my page, which is also a link.

      It has a background color, which changes when my mouse passes over it.

      I also want an image on the page to swap with another image when my mouse over the text.

      Please can someone direct me to a site that explains how to create a disjointed rollover using text instead of an image.

      Thanks in advance

      On this page, you have several instances of code like this-

      Fuel:

                 

      Just replace in this.

      and add this to your CSS-

      label of TD {text-align: right ;}}

      Then you must ensure that the values in your

      Then your page validates.

      Personally, I don't think it's worth the effort to migrate away from your leaking implementation.  And as far as I know, no one in this thread has recommended either you do that, or given you a suggestion as to how.  Achieve this with CSS only would require a good amount of changes to your code, so that each an item in your menu also contained a tag style display: block and was sized and positioned at the location where the image exchanged is now. Then, you must create an image SPRITE containing all your images in Exchange stacked vertically in a single graph that would be awarded as background image for the tag.  Then you would add the CSS necessary to swap the position of the background in the tag image to one that shows the right image to the overview.  It's too tedious for this effect, honestly...

    • BlackBerry Smartphones display text messages in the message box

      I just got my Blackberry Curve yesterday and I'm stuck. I figured out how to separate my emails to my text messages in the 'Messages' box, but it is always default to my email messages when I opened the box "Messages". How can I make the text message folder? (There is no "hide folder" option I can find it, and when I separated from email and texts no new record did come on my homescreen).

      Thank you!

      If you have changed "SMS and Email" to separate boxes? On my machine, I had to look in my Applications folder to find the icon 'SMS and MMS '. After that I found it, I was able to move on the home screen.

    • I use Adobe Acrobat Pro and when I click on save as PDF... PDF reader enable adding text in the Documents does not appear. Why?

      Can you please tell me why?

      With my Adobe Acrobat Pro, when I click on save as PDF... PDF reader enable adding text in the Documents does not appear.

      Thank you

      Elina Mackay

      Adobe change Acrobat a lot between releases. Make sure you follow instructions to the same version you have.

      If this looks OK, let us know the exact version you have (help > about Acrobat Pro).

    • I need a Korean font available in Adobe Muse as text and not as image.

      I need a Korean font available in Adobe Muse as text and not as image.  I went to Adobe Typekit and raise police SOURCE HAN WITHOUT KOREAN.  I chose the 'use' police, police has been sync and it is available in Muse, but not in the form of text, just like the picture.  HOW can I use this font in text form? He is listed as the system font. ??? Help, please.

      I had the same problem when I wanted to use the Source Han San for the Chinese.

      Muse apparently does not yet support languages.

      The only way is to use a hosted free font: Add self-hosted web fonts | Adobe Muse CC tutorials

    • Change the text in the pop-up box?

      What is the way better / simpler to modify the text in a pop-up box? I have an interaction of box click Run Javascript with an alert box, but the title of this one is «Adobe Captivate» I know that a regular Javascript alert message is not editable, but I wonder if, because it's style, there is a strain I can shape. I appreciate any help!

      dialogue box.png

      Run this JavaScript:

      CP. Alert ("message", "title")

    Maybe you are looking for

    • Satellite 4100XCDT: how the IRDA port works under DOS

      I have a Toshiba Satellite 4100xcdt. How do I assign a COM port to the IRDA (infrared) port in the BACK so I can use programs such as Winsamphttp://www.veg.Nildram.co.UK/remote.htm The BIOS assigns COM1 and COM2 serial port to the built-in modem. How

    • Correct settings to use Smart Connect and load balancing?

      Hi guys I have a question, the answer of which I was not able to find explicitly, so I hope a quick fix OK / not OK for you: I would use tri-band technology provides the R8000, i.e. to activate Smart Connect / load balancing. Is - it only works Ghzs

    • "Desktop" option from menu bars!

      MacBook Pro (retina, 13 inches, end of 2013) PROCESSOR - 2.4 GHz Intel Core i5 MEMORY - DDR3 4 GB 1600 MHz OS X EL CAPITAN Vs - 10.11.1 Hello! Please can someone help me with this? I have google everyday but I'm always hurt! When I want to load a fil

    • Can someone show me how to get the data of this vi in four columns in a spreadsheet file.

      I'm trying to get the data into four columns on a worksheet. The data consists of two channels and two measures, a maximum voltage and a voltage after x seconds. I enclose the code. Any help would be great. Thank you.

    • DeskJet F340

      HP Deskjet F340 All in one printer print well the first lines of the document, and then it vanishes. I don't have black ink and I bought it in the HP store not so long ago. I printed only aprox. 35 pages and I don't think it could be empty. I took th