anchor opening element on separate page not working? - jquery-plugins

I am trying to get my anchors of thumbnails to open to a different page but at the specific element. I don't think it is working as there is a jquery plugin on the page that the elements exist on and I can't find a way to target them. When you click on a image it opens on the first in the sequence but not on the image requested. How can this be solved?
Please see my page here http://i-n-t-e-l-l-i-g-e-n-t-s-i-a.com/melissafranklin.com/index.html

The href attribute of the <a> tag should match the src attribute of the <img> tag
Use this:
<a href="images/paintings/7copy.jpg">
<img src="images/paintings/7copy.jpg" alt="">
</a>
Instead of this:
<a href="paintings.html">
<img src="images/paintings/7copy.jpg" alt="">
</a>

Related

Xpath - Exclude elements within TD

I'm trying to use Chrome's scraper extension using XPath. I've been able to scrape everything I need from a table, but I'm stuck in one spot. Here's the source
<td>
<p class="pClass">
<a href="theurl" target="_blank">
<i class="iClass">someText</i>
Anchor text
</a>
</p>
</td>
I'm trying to grab just the URL, but when using my Xpath code as td[9]/p/a it grabs the icon part that says "someText". Is there a way to just grab the URL?
In order to extract url just add #href to your xpath expression, this should work: //td[9]/p/a/#href.
For stripping white space you can use xpath function normalize-space().

Pinterest multiple parameters for detail url in description

I am integrating the Pin it functionality in my website, but I am unable to pass multiple parameters in url or description . I have tried with the following code
$detail_wow_pin = $baseurl.'/wow/Wowitems/wowdetail?
obj_id='.$obj_id.'&obj_type='.$obj_type;
<a href="http://pinterest.com/pin/create/button/?
url=http://softprodigy.in/thinkbright/wow/Wowitems&media=<?=$wowimg?>
&description=<?='http://'.$_SERVER['SERVER_NAME'].''.$detail_wow_pin?>"
count-layout="none">
<img src="<?php echo IMG_WOWS; ?>/img/pinterest.png" alt="">
</a>
Thanks
I find properly url encoding the entire href, confirming the ampersand (&) encodes as & inside the href attribute. Furthermore, & encodes as %26 inside the url parameter and moving the url parameter to the last place in the href attribute will properly create the link back to the page containing the image when clicked on from your pin it board.
Example:
<img src="//assets.pinterest.com/images/pidgets/pin_it_button.png">
Dynamic Link for Pinterest
Below code will generate dynamic pinterest button for different pages.
<a href="http://pinterest.com/pin/create/button/?url=http://www.example.com/page-one&media=http://www.example.com/image/cache/data/image.jpg&description=description will come here" class="pin-it-button" count-layout="none">
<img src="http://assets.pinterest.com/images/PinExt.png" data-cfsrc="//assets.pinterest.com/images/PinExt.png" title="Pin It" border="0">
</a>

place span tag between anchor tag using Action Link Helper

I got website templates and using it for my website. I am new to asp.net mvc 3 and razor. It is very difficult to modify html tag using html helper. How can I place the span tag between anchor tag using ActionLink Helper. I have used razor and html helper for producing link.
I want to produce following tags:
<li><span class="glyph logout"></span> Logout</li>
I have try this
<li>#Html.ActionLink("<span class='glyph logout'></span> Log out", "LogOff", "Account") </li>
I am confuse how to do that. It is not the correct way that produces span tag as string. How can I produce correct tags.
What you want to use is #Url.Action to create the URL while having your custom HTML.
<li>
<a href="#Url.Action("LogOff","Account")" title="Logout">
<span class="glyph logout"></span> Logout
</a>
</li>
This way you have control over the URL and be able to add your own custom HTML. #Html.ActionLink doesn't allow you to add custom HTML inside the tags natively.
If you need to customize, what's inside your anchor tag, you should use the Html.Action method instead of the Html.ActionLink
<li>
<a href="#Html.Action("LogOff", "Account")" title="Logout">
<span class="glyph logout"></span> Log
</a>
</li>

What does this Firefox symbol mean?

This symbol of a ripped paper is appearing on some of my <a> tags in Firefox Browser..
Here is an example:
Does anyone know what this means?
Thanks!!
update : here's some code:
<a href="#" onClick="jQuery('#youtube-player-container').tubeplayer('play');">
<img class="mp3button" style="background-image:url('/mp3_play.png');background-size:100% 100%;" />
</a>
(the image does appear appears so it's not a problem with the img src)
The ripped paper icon is for a broken image src. You would see it if you requested an image that didn't exists ie:
<img src="notarealimage.jpg"/>
In your case you have no src attribute, which is why the browser sees it as a broken image.
Given that you're using a background image on your img tag, I suggest changing the img tag to a span or div tag, or just adding the style attribute to the a tag and removing the img tag altogether, i.e:

Starting ColorBox slideshow using a link

I would like to have a page with both an image gallery and a slideshow. The slideshow should be started when I click the link, the normal ColorBox should be used when I click one of the images.
What I do now is group all the images with a rel. For the slideshow link I use the following code:
<a rel="slideshow" href="#">Display slideshow</a>
In the configuration for colorbox I define rel as the rel I use for the images. This works almost, the problem I have with this is that I get an extra empty page at the beginning.
How can I start a slideshow of an image gallery, using a text link?
I searched for how to do this for a long time, and finally found the answer on - where else - the F.A.Q for Colorbox. The example is worded a bit differently though so it wasn't as easy to find as you might think. Especially if you're asking question in these terms, like I was.
<div style="display:none;"> <!-- optionally hide this div -->
<a rel="gallery" href="/slideshow/one.jpg">Caption 1</a>
<a rel="gallery" href="/slideshow/two.jpg">Caption 2</a>
<a rel="gallery" href="/slideshow/three.jpg">Caption 3</a>
</div>
<a id="openGallery" href="#">Display slideshow</a>
<script type="text/javascript">
var $gallery = $("a[rel=gallery]").colorbox();
$("a#openGallery").click(function(e){
e.preventDefault();
$gallery.eq(0).click();
});
</script>
http://jacklmoore.com/colorbox/faq/#faq-click

Resources