Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17


Classic ASP VBScript - Add dynamic Facebook button to images

Posted on 2013-12-18
Medium Priority
Last Modified: 2013-12-22
Hi, Experts.

I am majorly stumped.

I have a site with a simple ASP VBScript repeat region of images that pop up into a lightbox-type of window.

I have a "canned" script that overlays Twitter and Facebook icons to share them, respectively.

(View here:

I cannot seem to get the Facebook image to share correctly.

No matter which image I choose, it continually shares the site's background image, and the page's TITLE.

HOWEVER - when looking at the URL in the Facebook popup window, it shows the correct image in the query string.

If you test it on the site, you will see what I'm referring to.

Below, I have pasted the .js blocks and the ASP repeat region block.
(Please let me know if you need anything else).

Here they are:

JAVASCRIPT (From a linked .js file in the page)
        var qualifyURL = function (url) {
            var img = document.createElement('img');
            img.src = url; // set string url
            url = img.src; // get qualified url
            img.src = null; // no server request
            return url;

        var setupFacebook = function ($tiles) {
            addSocialIcon($tiles, "fb-icon fa fa-facebook", "Facebook");
            $tiles.find(".fb-icon").click(function (e) {

                var image = $(this).parents(".tile:first").find("img.item");

                var $caption = $(this).parents(".tile:first").find(".caption");
                var text = plugin.settings.facebookText || document.title;
                if (!plugin.settings.facebookText && $caption.length == 1 && $caption.text().length > 0)
                    text = $.trim($caption.text());

                var url = "" + encodeURI(location.href.split('#')[0]) + "&t=" + encodeURI(text);

                if (image.length == 1) {
                    var src = image.attr("src");
                    url += ("&p[images][0]=" + qualifyURL(src));

                var w =, "ftgw", "location=1,status=1,scrollbars=1,width=600,height=400");
                w.moveTo((screen.width / 2) - (300), (screen.height / 2) - (200));

Open in new window

REPEAT REGION BLOCK on the image page:
<article class="tile ftg-<%=(rsImages.Fields.Item("imageCatClass").Value)%>">
<a class="tile-inner" href="<%=(rsImages.Fields.Item("imagePath").Value)%>" title="">
<img class="item" src="<%=Replace((rsImages.Fields.Item("imagePath").Value),".","_thumb.")%>" />
<div class="caption">

Open in new window

Thank you so much!
Question by:lshane
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
LVL 53

Accepted Solution

Scott Fell,  EE MVE earned 2000 total points
ID: 39728394
This has nothing to do with your asp code.  Remember, asp is server side and runs on the web server before the page even loads.  Once you html is rendered, then your js/jquery is run.  The only way your asp code would come into play is if it is generating the html and your code was not correct and causing html errors.

Right now, the only error that does not validate is the fact you are not using alt tags. However, this will not affect the layout.  

It is best in a case like this to start out at the end with your rendered html or static html.  In this case, it is kind of a mess and that is the reason why facebook can't find your images when shared..  

The first thing I noticed is you have your background image in your page as an image and then I saw it again on the style sheet.   Then all of the images are below.  

I would start the page over as a static html page first.  Make sure your background is a background of an element and not an image in your html to start.   somehow from either your css or your js code you have managed to move the other images  over what you are calling the background image.  

Get this working as a simple static page.  Then rebuild it using your asp/vb.

Author Closing Comment

ID: 39735213
OK thank you.

Featured Post

Quiz: What Do These Organizations Have In Common?

Hint: Their teams ended up taking quizzes, too.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

670 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