The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Turn "Title=" into HREF to link to .pdf
rcanpolat
post Sep 6 2011, 02:37 PM
Post #1


Member
***

Group: Members
Posts: 76
Joined: 4-August 09
Member No.: 9,327



Hi,

I've bought a template for a site I'm building. I've almost got the entire thing all finished but i'm at a bit of a road block. The site is quite heavy on different css sheets & js so its a bit of a mess trying to navigate around to put in my own code so I'm wondering is there a simple way around this.

Basically as you can see from my code below i've got a Gallery on the site. The gallery pre loads images and then displays them. In this case it pre loads "granite_cleaning.jpg"

On hover a little black box slides up displaying the text "Granite Worktop (Clean & Re-Seal)"

On click of the image or js slider it loads a lightbox onto the page displaying the image "STORAC01.jpg" along with a fancy "close" icon, and a fancy "next / previous" button

The text "CLICK HERE TO DOWNLOAD AND PRINT" is shown below the image on the left on the lightbox. Basically i would like to turn that text into a hyperlink where i can link it to a .pdf where a user can print a voucher. Problem is that "title=" is already part of the "<a href=" line of code.

Is there any simple way i can do this? Im talking like to slap a bit of code directly into the html without having to sift through the css sheets and html. There are about 5 different stylesheets being used for different purposes along side a bucket load of js.

CODE

<li>
<a href="gallery/offers/vouchers/STORAC01.jpg" title="CLICK HERE TO DOWNLOAD AND PRINT" rel="prettyPhoto[gallery2]">
<img src="gallery/offers/granite_cleaning.jpg" width="290" height="153" alt="" />     
<span class="cover boxcaption">
<span class="prjname">Granite Worktop (Clean & Re-Seal)</span>                                
<span class="gall"></span>                                                
</span>
</a>
</li>


I hope I'm making sense


--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 6 2011, 05:49 PM
Post #2


.
********

Group: WDG Moderators
Posts: 6,286
Joined: 10-August 06
Member No.: 7



QUOTE(rcanpolat @ Sep 6 2011, 09:37 PM) *

Problem is that "title=" is already part of the "<a href=" line of code.

I don't understand. unsure.gif


--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rcanpolat
post Sep 6 2011, 06:05 PM
Post #3


Member
***

Group: Members
Posts: 76
Joined: 4-August 09
Member No.: 9,327



Basically what i would like to do is this

Original line of code:

CODE
<a href="gallery/offers/vouchers/STORAC01.jpg" title="CLICK HERE TO DOWNLOAD AND PRINT" rel="prettyPhoto[gallery2]">


What i want to do:

CODE
<a href="gallery/offers/vouchers/STORAC01.jpg" title="CLICK HERE TO DOWNLOAD AND PRINT" ****When somebody clicks on the text "Click Here To Download & Print i want it to hyperlink to a pdf**** rel="prettyPhoto[gallery2]">


Make sense now? Or should i make a video? laugh.gif


--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Sep 6 2011, 07:03 PM
Post #4


WDG Member
********

Group: Root Admin
Posts: 8,032
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



You can't do that using the title attribute.

What you're doing sounds more like a drop-down menu than a tooltip. For example:
http://meyerweb.com/eric/css/edge/menus/demo.html
http://www.alistapart.com/articles/dropdowns/


--------------------
Darin McGrew
WDG Member since 1998
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rcanpolat
post Sep 6 2011, 07:12 PM
Post #5


Member
***

Group: Members
Posts: 76
Joined: 4-August 09
Member No.: 9,327



I was thinking about using inline content instead with pretty photo js but now i can't seem to be able to embed an inline photo. it just becomes like a slide show on my pre loader

is there any other way to embed images without using src? Say some basic javascript that wouldn't conflict?


--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rcanpolat
post Sep 7 2011, 05:23 AM
Post #6


Member
***

Group: Members
Posts: 76
Joined: 4-August 09
Member No.: 9,327



Found a work around. I know i'll be shot for saying this but iframe's done the trick


--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 17th December 2014 - 02:56 PM