Announcement

Collapse
No announcement yet.

PopUp link (without text?)

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    PopUp link (without text?)

    Hi,

    I've just been reading through the Advanced Actinic Guide (seriously running before learning to walk), and have got a Javascript popup window to work with a small product image.

    However, when specifying the popup's target file/URL in product Details/Advanced/General tab, a text link is required to validate the URL (which creates the 'enlarge' link that appears in the attached screengrab).

    Is there a way to add a popup link to my product images, without creating a text link too?

    Thanks.
    Attached Files
    edwards

    #2
    OK, solved it (kind of).

    Realised to NOT reference the file/URL in the Product Details/Advanced/General tab, and instead reference the file/URL as a value in the Product Details/Advanced/Properties tab, under the URL Property.

    However, as I'm referencing an image directly (12.jpg), the popup has white border space around.

    Does anyone know of a good way to popup a borderless html window template, and insert the product image (12.jpg for example) into it?
    edwards

    Comment


      #3
      You can set the height and width of the window in the javascript, e.g.
      Code:
      <script language="JavaScript">
      <!--// beginning of Javascript script
      function popUp(url) {
              window.open(url, 'newwindow',
      'width=620,height=510,menubar=off,directories=off,toolbar=off');
      }
      // end of script -->
      </script>
      and they can be set to match the dimensions of the image. However, if the images vary in size, I don't know a way to make the window adapt to the dimensions of the image it is displaying.
      Ben Popplestone
      Ecommerce website software

      Comment


        #4
        Thanks.

        I've already added an even border to the default popup, by making the dimensions larger.

        However, I have got this script that works exactly as I want in a single page, but no such luck using Actinic's multiple templates:

        <SCRIPT LANGUAGE="JavaScript">
        function popUp(url,FEATURES) {

        CONTENT = "<HTML><HEAD><TITLE>NETQUOTEVAR:PRODUCTNAME</TITLE></HEAD>" +
        "<BODY><CENTER><IMG SRC='" + url + "' BORDER=0>" +
        "<FORM><INPUT TYPE='BUTTON' VALUE='Close' " +
        "onClick='window.close()'></FORM>" +
        "</CENTER>"+
        "</BODY></HTML>";
        pop = window.open("","",FEATURES);
        pop.document.open();
        pop.focus();
        pop.document.write(CONTENT);
        pop.document.close();
        }
        </SCRIPT>


        <A HREF="javascript:void(0)" onClick="popUp ('url','width=300,height=400,toolbar=0,scrollbars=0')"><img src="NETQUOTEVAR:PRODUCTIMAGE" border="0"></A>

        Thankfully, all my images are exactly the same size, so this method would be great.

        Any ideas?
        edwards

        Comment


          #5
          This is about the limit of my javascript knowledge I'm afraid, but looking at it, it seems a bit like overkill for a popup function. How does it differ from the script in my previous post?
          Ben Popplestone
          Ecommerce website software

          Comment


            #6
            It allows you to create a 'custom html page' popup for an image, and thus allows you to specify body margins etc, to get rid of the default border magins you get when you open a file directly.

            By creating a html file in which to place the image in this way, the title of the image could also be passed to the popup window, or other details.

            The key benefit from using this approach, is the potential of 'control' over the appearance of the popup, which your method does not allow (the border, and lack of title for examples).

            I too am not fully converse with JavaScript, but see the potential. But with pages being created from numerous templates, it is hard to know exactly how to break the code up to work with actinic in this way.
            edwards

            Comment


              #7
              I see what you mean.
              But with pages being created from numerous templates, it is hard to know exactly how to break the code up to work with actinic in this way.
              The code inbetween the <script ...> and </script> tags, I would insert just above the </head> tag of your Primary template. The hyperlink should go in the ProductLine template although it should be in the format
              Code:
              <A HREF="javascript:void(0)" onClick="popUp ('url','width=300,height=400,toolbar=0,scrollbars=0')">NETQUOTEVAR:PRODUCTIMAGE</A>
              Ben Popplestone
              Ecommerce website software

              Comment


                #8
                Thanks for that.

                Tried implementing it again (without double IMG tags - thanks for that), but still haven't quite got it to work.

                I've got this in Act_Primary.html:

                <script language="JavaScript">
                function popUp(CUSTOMVAR:URL,FEATURES) {
                CONTENT = "<HTML><HEAD><TITLE>NETQUOTEVAR:PRODUCTNAME</TITLE></HEAD>" +
                "<BODY MARGINWIDTH=0 MARGINHEIGHT=0 RIGHTMARGIN=0 LEFTMARGIN=0 TOPMARGIN=0 BOTTOMMARGIN=0><CENTER><IMG SRC='" + CUSTOMVAR:URL + "' BORDER=0>" +
                "</CENTER>"+
                "</BODY></HTML>";
                pop = window.open("",FEATURES);
                pop.document.open();
                pop.focus();
                pop.document.write(CONTENT);
                pop.document.close();}

                </script>




                And I've got this in my external popup.txt file:

                <A HREF="javascript:void(0)" onClick"popUp('CUSTOMVAR:URL',width=300,height=400,toolbar=0,scrolling=0')">NETQUOTEVAR:PRODUCTIMAGE</A>



                I know the URL is passed through the txt file, as it works for your basic suggested JavaScript popup. But, cannot get this javascript popup working with actinic still. It surely must be to do with the way I'm trying to pass the URL to the javaScript function.

                Any ideas?
                edwards

                Comment


                  #9
                  The Actinic javascript expression is called 'ShopPopUp' rather than just 'PopUp'. That could be the issue.

                  Comment


                    #10
                    It's worth a try. Thanks.
                    edwards

                    Comment

                    Working...
                    X