[Solved] Help With "Title" in the Code

[RT]

Hi,

New to the forum and not very good with CSS… I am stumbling on this piece of code

<a title="A Title"><img src="images/sampledata/fruitshop/rsz_21marshall.jpg" alt="" />

I could not get the code to show up so I made changes to it so it shows up in the forum, I realize the tags < / > are incorrect… my problem is the secon d title”title” attribute does not show up…

Everything works fine except getting the title for the img class title=”Title” to show up

Can anyone show me if there is a way? or what I am doing incorrectly?

Thank you,
Reed

[Paulie_D]

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes#title

Isn’ t the title the name of that thing that displays when you’re hovering an image.

http://codepen.io/Paulie-D/pen/rGxaw

[RT]

Hi , thanks for the replies..

The “title” i am trying to get to display is within the “Polaroid ” picture frame of the

class=”yjt_polaroid yjt_group radiusb8″ title=”My Image”

this creates a neat little Polaroid picture and the “title” goes at the bottom of the fram with the image in the center.

It is not the title for the alt”” hover title or for the popover title which are also implimted, hope this make sense…

[shaneisme]

I’ve used JavaScript sometimes to use the title of objects, mostly for modal windows.

alt is used for many things, mostly for accessibility these days. A screen reader will recite what you have in there so blind users can know what an image is.

title is attributed only to an <a> object, and when it’s detected there will be a hover tooltip. Screen readers will also read the title along with the destination and text inside the <a>.

If you want the title to show up below the picture, you would need a script to do that for you OR, you can simply use HTML and place it below the picture.

[RT]

Thanks for the reply…

I am using 2 different codes but basically I am trying to add a popover to the Polaroid image any ideas on how to do that?

Thanks for any help…

[Paulie_D]

Perhaps you could show us some code…ideally in a Codepen.io example.

Otherwise we’re kind of working in the dark.

There are several ways to do this some of which will depend on what you mean by ‘popover’

A picture of how this is supposed to look before/after would be helpful too.

Finally, from your basic description, it sounds like this ‘title’ is actual content …in which case it should be text in the HTML and not an attribute like it is now.

[RT]

Thanks for the help..

this is how it looks now…

This is how/what I want it to look like

The bottom section with the words “Inspired By Marshall” are the title I am trying to achieve.

I can achieve the title on it’s own… it is when I try to create “hover” Popover for the image that it fails.. The Polaroid image also has a ’tilt” animation which I get to work with the popover, I just cannot get the “title” to display and make it all work together..

By popover i mean….

I want the Polaroid image with the “Inspired by Marshall” title … then when you hover over the image with the title the popup to to occur along with the “tilt” of the Polaroid image

Currently I have the Polaroid image, hover over it and get the tilt with the popover but I cannot get the “Inspired by Marshall” title to be displayed at the bottom of the Polaroid image,…

Thanks again for all the help!

[Paulie_D]

A picture of how this is supposed to look before/after would be helpful too.

I’m assuming that’s the basic image….Could we see your current code in a Codepen.io example.

Quite simply, and most semantically and also good for ESS EEE OH would be for you to use plain simple text in your HTML.

In fact, the figure/figcaption elements would be ideal here.

[RT]

” Could we see your current code in a Codepen.io example.”

lol, sure, how do I do that?

[Paulie_D]

https://css-tricks.com/forums/topic/a-guide-to-using-codepen-help-us-help-you/

Like this

http://codepen.io/Paulie-D/pen/gyGjH

[nixnerd]

Here’s how:

1. Go to Codepen.io

2. Click “New Pen”

3. Add HTML, CSS, and JS respectively.

4. Post link to the pen here.

BTW, is that your real gmail address as your handle? You probably want to change that before a bot snags it and starts sending you Viagra spam.

[nixnerd]

Looks Complicated!

HA HA HA! My sentiments exactly every time I look at a circuit board of any kind.

[Paulie_D]

BTW, is that your real gmail address as your handle? You probably want to change that before a bot snags it and starts sending you Viagra spam.

Yeah, I was going to mention that. You can swap it out in your Profile settings.

On the other hand, I have no problem with Viagra spam….I’ll take any help I can get.

:)

[RT]

Ha, wow, I didn’t even realize that… I switched from Firefox to Chrome and it just fills things out differently..

Thanks for the heads up..

[RT]

Is This What You Need?

[Author]

Posts