JavaScript Image Popup's

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Santander

    JavaScript Image Popup's

    there are many versions of JavaScipt image popups exist which show image
    preview when we click on a thumbnail image to view a larger version.
    What is the best way?

  • SAM

    #2
    Re: JavaScript Image Popup's

    Le 10/14/08 5:06 PM, Santander a e'crit :
    there are many versions of JavaScipt image popups exist which show
    image preview when we click on a thumbnail image to view a larger version.
    What is the best way?
    This one :
    <http://www.huddletoget her.com/projects/lightbox2/>
    or that one :
    <http://www.cssplay.co. uk/menu/gallery.html>
    ??

    Comment

    • Santander

      #3
      Re: JavaScript Image Popup's

      both looks nice, not not too practical. The 1st sample takes a time when
      load/adjust window, plus add this Vista "black background" effect, whereas
      the regular javascript popup works faster - just open on click and close on
      click. 2nd one show preview on mouseover. What I meant is simple popup that
      opens on click on closes on click.

      thanks.
      -----


      "SAM" <stephanemoriau x.NoAdmin@wanad oo.fr.invalidwr ote in message
      news:48f4bb55$0 $906$ba4acef3@n ews.orange.fr.. .
      Le 10/14/08 5:06 PM, Santander a e'crit :
      >there are many versions of JavaScipt image popups exist which show image
      >preview when we click on a thumbnail image to view a larger version.
      >What is the best way?
      >
      This one :
      <http://www.huddletoget her.com/projects/lightbox2/>
      or that one :
      <http://www.cssplay.co. uk/menu/gallery.html>
      ??

      Comment

      • Thomas 'PointedEars' Lahn

        #4
        Re: JavaScript Image Popup's

        Santander wrote:
        there are many versions of JavaScipt image popups exist which show image
        preview when we click on a thumbnail image to view a larger version.
        What is the best way?
        Probably nothing that already exists, including Lightbox & Co. It needs to
        be interoperable, fully standards-compliant, easy to write, and must work if
        client-side script support is disabled; pick two.

        Your From header is borken.


        Score adjusted

        PointedEars
        --
        Use any version of Microsoft Frontpage to create your site.
        (This won't prevent people from viewing your source, but no one
        will want to steal it.)
        -- from <http://www.vortex-webdesign.com/help/hidesource.htm>

        Comment

        • Evertjan.

          #5
          Re: JavaScript Image Popup's

          Thomas 'PointedEars' Lahn wrote on 15 okt 2008 in comp.lang.javas cript:
          Your From header is borken.
          Borken = place in Germany.

          --
          Evertjan.
          The Netherlands.
          (Please change the x'es to dots in my emailaddress)

          Comment

          • Dr J R Stockton

            #6
            Re: JavaScript Image Popup's

            In comp.lang.javas cript message
            <Xns9B38D42BACC D3eejj99@194.10 9.133.242>, Wed, 15 Oct 2008 18:51:29,
            Evertjan. <exjxw.hannivoo rt@interxnl.net posted:
            >Thomas 'PointedEars' Lahn wrote on 15 okt 2008 in comp.lang.javas cript:
            >
            >Your From header is borken.
            >
            >Borken = place in Germany.
            ^s
            See <http://en.wikipedia.or g/wiki/Borken>.

            --
            (c) John Stockton, nr London UK. ???@merlyn.demo n.co.uk Turnpike v6.05 MIME.
            Web <URL:http://www.merlyn.demo n.co.uk/- FAQish topics, acronyms, & links.
            Check boilerplate spelling -- error is a public sign of incompetence.
            Never fully trust an article from a poster who gives no full real name.

            Comment

            • Santander

              #7
              Re: JavaScript Image Popup's

              so what is sample of easy, interoperable, standards-compliant, working even
              when client-side script support is disabled script?
              Somethingf simple with href?

              Santander
              ---------

              "Thomas 'PointedEars' Lahn" <PointedEars@we b.dewrote in message
              news:48F61D64.6 000908@PointedE ars.de...
              Probably nothing that already exists, including Lightbox & Co. It needs
              to
              be interoperable, fully standards-compliant, easy to write, and must work
              if
              client-side script support is disabled; pick two.
              >
              Your From header is borken.
              >
              >
              Score adjusted
              >
              PointedEars
              --
              Use any version of Microsoft Frontpage to create your site.
              (This won't prevent people from viewing your source, but no one
              will want to steal it.)
              -- from <http://www.vortex-webdesign.com/help/hidesource.htm>

              Comment

              • SAM

                #8
                Re: JavaScript Image Popup's

                Le 10/14/08 6:10 PM, Santander a écrit :
                both looks nice, not not too practical. The 1st sample takes a time when
                load/adjust window, plus add this Vista "black background" effect,
                whereas the regular javascript popup works faster - just open on click
                and close on click. 2nd one show preview on mouseover. What I meant is
                simple popup that opens on click on closes on click.
                The second works too with onclick
                (probably not with IE < 8)

                You asked the best ways, no ?
                They are.

                Popups are most of the time badly appreciated by users.
                (some browsers can be fixed to disallow them)

                Today the displaying of big image in same window is the way.
                (if javascript is enabled)
                (if not, the big image is displayed in same window and the user has to
                click the back button of is navigator to come back to the gallery)

                <a href="big_image .jpg" onclick="return pop(this)">
                <img src="small_imag e" alt="thumbnail" title="venus">
                </a>


                JS :
                ====
                var IE=false; /*@cc_on IE=true; @*/
                function pop(what) {
                var v = document.getEle mentById('viewe r');
                v.src = what.href;
                v.style.display = 'block';
                if(IE) {
                var top = document.body.s crollTop ||
                document.docume ntElement.scrol lTop;
                v.style.top = +top +10 + 'px';
                }
                return false;
                }

                CSS :
                =====
                #viewer { position: fixed; top: 10px; right: 20px; padding: 10px;
                background: #999; border: 5px outset gold; display: none;
                cursor: pointer;
                /* hack IE */ _cursor: hand; _position: absolute;
                }

                HTML :
                ======
                <img src="" id="viewer" alt="" onclick="this.s tyle.display='n one';"
                title"click to close me">
                </body>


                --
                sm

                Comment

                • Santander

                  #9
                  Re: JavaScript Image Popup's

                  The code you specified does not work though. please show it in HTML page.

                  Santander
                  -------------

                  "SAM" <stephanemoriau x.NoAdmin@wanad oo.fr.invalidwr ote in message
                  news:48f90dde$0 $883$ba4acef3@n ews.orange.fr.. .
                  Le 10/14/08 6:10 PM, Santander a écrit :
                  >both looks nice, not not too practical. The 1st sample takes a time when
                  >load/adjust window, plus add this Vista "black background" effect,
                  >whereas the regular javascript popup works faster - just open on click
                  >and close on click. 2nd one show preview on mouseover. What I meant is
                  >simple popup that opens on click on closes on click.
                  >
                  The second works too with onclick
                  (probably not with IE < 8)
                  >
                  You asked the best ways, no ?
                  They are.
                  >
                  Popups are most of the time badly appreciated by users.
                  (some browsers can be fixed to disallow them)
                  >
                  Today the displaying of big image in same window is the way.
                  (if javascript is enabled)
                  (if not, the big image is displayed in same window and the user has to
                  click the back button of is navigator to come back to the gallery)
                  >
                  <a href="big_image .jpg" onclick="return pop(this)">
                  <img src="small_imag e" alt="thumbnail" title="venus">
                  </a>
                  >
                  >
                  JS :
                  ====
                  var IE=false; /*@cc_on IE=true; @*/
                  function pop(what) {
                  var v = document.getEle mentById('viewe r');
                  v.src = what.href;
                  v.style.display = 'block';
                  if(IE) {
                  var top = document.body.s crollTop ||
                  document.docume ntElement.scrol lTop;
                  v.style.top = +top +10 + 'px';
                  }
                  return false;
                  }
                  >
                  CSS :
                  =====
                  #viewer { position: fixed; top: 10px; right: 20px; padding: 10px;
                  background: #999; border: 5px outset gold; display: none;
                  cursor: pointer;
                  /* hack IE */ _cursor: hand; _position: absolute;
                  }
                  >
                  HTML :
                  ======
                  <img src="" id="viewer" alt="" onclick="this.s tyle.display='n one';"
                  title"click to close me">
                  </body>
                  >
                  >
                  --
                  sm

                  Comment

                  • MartinRinehart@gmail.com

                    #10
                    Re: JavaScript Image Popup's

                    Santander wrote:
                    there are many versions of JavaScipt image popups exist which show image
                    preview when we click on a thumbnail image to view a larger version.
                    What is the best way?
                    This site links tnails to large pictures, 100% HTML, 0% JavaScript:
                    http://www.monksvillephotograhs.org .

                    Comment

                    • MartinRinehart@gmail.com

                      #11
                      Re: JavaScript Image Popup's

                      Oops. Try:


                      Comment

                      • SAM

                        #12
                        Re: JavaScript Image Popup's

                        Le 10/20/08 3:21 PM, Santander a écrit :
                        The code you specified does not work though.
                        except if typo it has to run
                        (tested IE6 and Fx.3)
                        please show it in HTML page.
                        <http://cjoint.com/?kutwNZYx3z>


                        --
                        sm

                        Comment

                        • SAM

                          #13
                          Re: JavaScript Image Popup's

                          Le 10/20/08 6:53 PM, MartinRinehart@ gmail.com a écrit :weight of the page : 2841 KB

                          Comment

                          • Santander

                            #14
                            Re: JavaScript Image Popup's

                            some details about viewer css:

                            #viewer { position: fixed; top: 10px; right: 20px;
                            padding: 10px; cursor: pointer;
                            background: #999; border: 5px outset gold; display: none;
                            _position: absolute; _cursor: hand;
                            }
                            div { height: 300px; margin-top: 20px; }
                            div img { width: 200px }

                            Thumbnails size controlled by this code?
                            div { height: 300px; margin-top: 20px; }
                            div img { width: 200px }

                            do this line goes right before the closing </bodytag?
                            <img src="" id="viewer" alt="" onclick="this.s tyle.display='n one';"
                            title"click to close me">

                            Santander
                            ------

                            "SAM" <stephanemoriau x.NoAdmin@wanad oo.fr.invalidwr ote in message
                            news:48fcbf93$0 $922$ba4acef3@n ews.orange.fr.. .
                            Le 10/20/08 3:21 PM, Santander a écrit :
                            >The code you specified does not work though.
                            >
                            except if typo it has to run
                            (tested IE6 and Fx.3)
                            >
                            >please show it in HTML page.
                            >
                            <http://cjoint.com/?kutwNZYx3z>
                            >
                            >
                            --
                            sm
                            >

                            Comment

                            Working...