How to pass image file name (SRC) to a function that creates a Web page?

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Amir
    #1

    How to pass image file name (SRC) to a function that creates a Web page?

    Hi,

    I'd like to know if it's possible to pass an image name (the IMG SRC
    attribute) from HREF element to a function that is activated by onClick
    event and creates a Web page.

    I have this HREF element:

    <A HREF onClick="showLa rgePicture()">< IMG HEIGHT=25 SRC="test01.jpg "></A>

    When an user clicks on the picture, the following code is performed:

    function showLargePictur e() {
    var lines="";
    lines+="<HTML>< HEAD>";
    lines+="<TITLE> Any Title</TITLE>";
    lines+="</HEAD>";
    lines+="<BODY onClick = 'window.close() '>";
    lines+="<IMG SRC='test01.jpg '>";
    lines+="<BR>";
    lines+="Click on the window to closes it";
    lines+="</BODY></HTML>";
    var newWin=window.o pen();
    newWin.document .open();
    newWin.document .write(lines);
    newWin.document .close();
    newWin.focus();
    }

    Is it possible to modify the code so it'll pass the SRC attribute to the
    function and thus to use it with any picture on the parent Web page?

    Thanks!



    Tags: None
    • Mick White
      #2
      Re: How to pass image file name (SRC) to a function that createsa Web page?

      Amir wrote:
      [color=blue]
      > Hi,
      >
      > I'd like to know if it's possible to pass an image name (the IMG SRC
      > attribute) from HREF element to a function that is activated by onClick
      > event and creates a Web page.
      >
      > I have this HREF element:
      >
      > <A HREF onClick="showLa rgePicture()">< IMG HEIGHT=25 SRC="test01.jpg "></A>
      >
      > When an user clicks on the picture, the following code is performed:
      >
      > function showLargePictur e() {
      > var lines="";
      > lines+="<HTML>< HEAD>";
      > lines+="<TITLE> Any Title</TITLE>";
      > lines+="</HEAD>";
      > lines+="<BODY onClick = 'window.close() '>";
      > lines+="<IMG SRC='test01.jpg '>";
      > lines+="<BR>";
      > lines+="Click on the window to closes it";
      > lines+="</BODY></HTML>";
      > var newWin=window.o pen();
      > newWin.document .open();
      > newWin.document .write(lines);
      > newWin.document .close();
      > newWin.focus();
      > }
      >
      > Is it possible to modify the code so it'll pass the SRC attribute to the
      > function and thus to use it with any picture on the parent Web page?
      >
      > Thanks!
      >[/color]

      It's real easy, but it doesn't make much sense, the image that opens in
      new window will be the same size as the image on the page. Is that what
      you want?
      Mick

        Comment

        • Amir
          #3
          Re: How to pass image file name (SRC) to a function that creates a Web page?

          "Mick White" <mwhite13@BOGUS rochester.rr.co m> wrote[color=blue]
          > Amir wrote:
          >[color=green]
          > > Hi,
          > >
          > > I'd like to know if it's possible to pass an image name (the IMG SRC
          > > attribute) from HREF element to a function that is activated by onClick
          > > event and creates a Web page.
          > >
          > > I have this HREF element:
          > >
          > > <A HREF onClick="showLa rgePicture()">< IMG HEIGHT=25[/color][/color]
          SRC="test01.jpg "></A>[color=blue][color=green]
          > >
          > > When an user clicks on the picture, the following code is performed:
          > >
          > > function showLargePictur e() {
          > > var lines="";
          > > lines+="<HTML>< HEAD>";
          > > lines+="<TITLE> Any Title</TITLE>";
          > > lines+="</HEAD>";
          > > lines+="<BODY onClick = 'window.close() '>";
          > > lines+="<IMG SRC='test01.jpg '>";
          > > lines+="<BR>";
          > > lines+="Click on the window to closes it";
          > > lines+="</BODY></HTML>";
          > > var newWin=window.o pen();
          > > newWin.document .open();
          > > newWin.document .write(lines);
          > > newWin.document .close();
          > > newWin.focus();
          > > }
          > >
          > > Is it possible to modify the code so it'll pass the SRC attribute to the
          > > function and thus to use it with any picture on the parent Web page?
          > >
          > > Thanks!
          > >[/color]
          >
          > It's real easy, but it doesn't make much sense, the image that opens in
          > new window will be the same size as the image on the page. Is that what
          > you want?
          > Mick
          >[/color]

          Mick,
          no, the image that opens in new window won't be the same size as the image
          on the page from which it opens. One image is specified by:
          <IMG HEIGHT=25 SRC="test01.jpg ">
          while the other image (which will be on the page that opens) is specified
          by:
          <IMG SRC='test01.jpg '>.


            Comment

            • wasntme
              #4
              Re: How to pass image file name (SRC) to a function that creates a...

              I wrote this to veiw animated gifs, wanted to be able to change the
              windows size and background color, but I'm sure there's a much simpler
              script out there..
              its written for five images..
              <html><head><ti tle>newWindow</title>
              <script language="javas cript"><!--
              function z1(){
              with(document.x x){
              p1b.value=('001 .jpg');
              bcb.value=('fff f00');
              hb.value=('200' );
              wb.value=('200' )}}
              function z2(){
              with(document.x x){
              p1b.value=('002 .jpg');
              bcb.value=('ff0 000');
              hb.value=('300' );
              wb.value=('300' )}}
              function z3(){
              with(document.x x){
              p1b.value=('003 .jpg');
              bcb.value=('fff fff');
              hb.value=('400' );
              wb.value=('400' )}}
              function z4(){
              with(document.x x){
              p1b.value=('004 .jpg');
              bcb.value=('000 0ff');
              hb.value=('500' );
              wb.value=('500' )}}
              function z5(){
              with(document.x x){
              p1b.value=('005 .jpg');
              bcb.value=('00f fff');
              hb.value=('600' );
              wb.value=('600' )}}
              function wm(){
              var p1=xx.p1b.value ;
              var bc=xx.bcb.value ;
              var h=xx.hb.value;
              var w=xx.wb.value;
              preWindow=open( "", "preWindow","st atus=no, toolbar=no, menubar=no,
              height="+h+", width="+w+", resizable=yes, top=0, left=0");
              with(preWindow. document){
              open();
              write('<html><h ead><title>..:: take.care::..<\/title>\n'
              +'<style type="text/css">\n'
              +'body{backgrou nd-color:#'+bc+';\ n'
              +'background-image:url('+p1+ ');\n'
              +'background-repeat:no-repeat;\n'
              +'background-position:center ;\n'
              +'margin:0px}<\/style><\/head>'
              +'<body onBlur="self.cl ose()">'
              +'<\/body><\/html>');
              close();
              focus();}} //--></script>
              <style type="text/css">
              body{background-color:#ffffff;
              color:#000000}</style></head>
              <body><div align="center">
              <form name="xx">
              <input type="hidden" name="p1b" size="8" value="">
              <input type="hidden" name="bcb" size="8" value="">
              <input type="hidden" name="hb" size="8" value="">
              <input type="hidden" name="wb" size="8" value="">
              <input type="image" src="001.jpg" height="60" width="60"
              onClick="z1();w m()">
              <input type="image" src="002.jpg" height="60" width="60"
              onClick="z2();w m()">
              <input type="image" src="003.jpg" height="60" width="60"
              onClick="z3();w m()">
              <input type="image" src="004.jpg" height="60" width="60"
              onClick="z4();w m()">
              <input type="image" src="005.jpg" height="60" width="60"
              onClick="z5();w m()">
              <h2>click anywhere on screen to close newWindow</h2>
              </form></div></body></html>

                Comment

                • Mick White
                  #5
                  Re: How to pass image file name (SRC) to a function that createsa Web page?

                  Amir wrote:

                  [color=blue]
                  >
                  > Mick,
                  > no, the image that opens in new window won't be the same size as the image
                  > on the page from which it opens. One image is specified by:
                  > <IMG HEIGHT=25 SRC="test01.jpg ">
                  > while the other image (which will be on the page that opens) is specified
                  > by:
                  > <IMG SRC='test01.jpg '>.
                  >[/color]



                  function showLargePictur e(src) {
                  var lines="<HTML><H EAD><TITLE>Any Title</TITLE></HEAD>";
                  lines+="<BODY onclick = 'window.close() '>";
                  lines+="<IMG SRC='"+src+"'>C lick on the window to close it";
                  lines+="</BODY></HTML>";
                  var newWin=window.o pen();
                  newWin.document .open();
                  newWin.document .write(lines);
                  newWin.document .close();
                  newWin.focus();
                  }

                  <image src="a.gif" onclick="showLa rgePicture(this .src)">



                  Mick

                    Comment

                    Previous template Next
                    Working...