Solved

Possible to use showtrail in excel

Posted on 2011-02-16
23
327 Views
Last Modified: 2012-05-11
Hi!

A java script called showtrail is a nice effect for pictures

My question is, is it possible to use showtrail in excel ?
0
Comment
Question by:team2005
  • 12
  • 11
23 Comments
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34906557
Is this what you want? Sample File Attached.

Sid

Dim boolEntry As Boolean
Dim OldHeight As Long
Dim OldWidth As Long

Private Sub Image1_MouseMove(ByVal Button As Integer, _
ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
    If boolEntry = False Then Exit Sub
    boolEntry = False
    Image1.Height = OldHeight + 10
    Image1.Width = OldWidth + 10
End Sub

Private Sub UserForm_Initialize()
    boolEntry = True
    OldHeight = Image1.Height
    OldWidth = Image1.Width
End Sub

Private Sub UserForm_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, _
ByVal X As Single, ByVal Y As Single)
    If boolEntry = True Then Exit Sub
    boolEntry = True
    Image1.Height = OldHeight
    Image1.Width = OldWidth
End Sub

Open in new window

Mouseover-Effect.xls
0
 
LVL 2

Author Comment

by:team2005
ID: 34907395
Hi!

Need same effect as showtrail, when i use mouseover on a picture.
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34909154
Could you please define showtrail?

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34978399
Hi!

Here is example of showtrial

http://www.dutyfree.no/trn/trncms.nsf/pages/parfyme_sok?open&dbs=A2EC9E75161F2F0AC12574A30060B5C2

Maby i just want to make a article list with css
That have this Titles in a table

Picture                Beskrivelse                            Pris

And with the effect showtrail on the small pictures


Any body have an good example
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34978697
You mean darken the picture on mouse over?

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34978756
Hi!

No, if you test this on this URL:
http://www.dutyfree.no/trn/trncms.nsf/pages/parfyme_sok?open&dbs=A2EC9E75161F2F0AC12574A30060B5C2

From the Text : Boss femme...
If you point over the picture on the left, it wil show a window with a bigger picture.
Here they are using  showtrial.

Have made a table myself now, but need to put this  showtrial effect to my pictures.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<meta name="GENERATOR" content="PageBreeze Free HTML Editor (http://www.pagebreeze.com)">
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" >
<title>sadasd</title>
</head>
<body bgcolor="#ffffff">
<h3>Artikkler</h3>
            <div class="ping">
             <table style="BORDER-BOTTOM: #cccccc 1px solid; BORDER-LEFT: #cccccc 1px solid; MARGIN: 0px auto; BORDER-TOP: #cccccc 1px solid; BORDER-RIGHT: #cccccc 1px solid" border="0" width="800">
<thead>
        <tr>
           <th width="60" align="left" bgcolor="#e5eecc">Bilde</th>
           <th width="90" align="left" bgcolor="#e5eecc">Varenummer</th>
           <th width="450" align="left" bgcolor="#e5eecc">Produkt navn</th>
           <th width="80" align="left" bgcolor="#e5eecc">Antall KS</th>   
           <th width="60" align="left" bgcolor="#e5eecc">Antall KS/Pall</th> 
          <th width="120" align="left" bgcolor="#e5eecc">Salgs enhet</th> 
        </tr>
  <tr>
    <td><img alt="Angry face" src="andebryst_horeca.gif" width="90" height="90"></td>
    <td align="middle">21010</td>
    <td>ANDEBRYST 4-PK, 6x1,2kg</td>
    <td align="middle">CA 7,20</td>
    <td align="middle">48</td>
    <td align="middle">KG</td></tr>
  <tr>
  <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">21080</td>
    <td>ANDELÅR 4-PK, 6x1kg</td>
    <td align="middle">CA 6,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td></tr>
  <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">11030</td>
    <td>HEL AND 4 STK, à ca2,5kg</td>
    <td align="middle">CA 10,00</td>
    <td align="middle">32</td>
    <td align="middle">KG</td></tr>
  <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">31010</td>
    <td>ANDECONFIT 10-PK, 3x2,5kg</td>
    <td align="middle">CA 7,50</td>
    <td align="middle">40</td>
    <td align="middle">KG</td>
  </tr>
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">41010</td>
    <td>ANDEPØLSE, 5x1kg</td>
    <td align="middle">CA 5,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">43010</td>
    <td>ANDEPATÈ, 10x0,5kg</td>
    <td align="middle">CA 5,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">31060</td>
    <td>VARMRØKT ANDEBRYST 2-PK, 15x0,5kg</td>
    <td align="middle">CA 7,50</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">51010</td>
    <td>SPEKET ANDEBRYST 2-PK, 15x0,3kg</td>
    <td align="middle">CA 4,50</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22040</td>
    <td>KYLLINGBRYST 4-PK, 6x1,5kg</td>
    <td align="middle">CA 9,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22070</td>
    <td>KYLLINGLÅR 3-PK, 6x1kg</td>
    <td align="middle">CA 6,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22080</td>
    <td>KYLLINGKLUBBE 8-PK, 6x1,2kg</td>
    <td align="middle">CA 7,20</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22090</td>
    <td>KYLLING OVERLÅR 6-PK, 6x1,2kg</td>
    <td align="middle">CA 7,20</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22100</td>
    <td>KYLLING OVERVINGE, 6x1kg</td>
    <td align="middle">CA 6,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">22110</td>
    <td>KYLLINGVINGER, 6x1kg</td>
    <td align="middle">CA 6,00</td>
    <td align="middle">48</td>
    <td align="middle">KG</td>
  </tr>
  
   <tr>
    <td><img alt="Angry face" src="heland.gif"></td>
    <td align="middle">12030</td>
    <td>HEL KYLLING, 4STK, à ca2,5kg</td>
    <td align="middle">CA 10,00</td>
    <td align="middle">32</td>
    <td align="middle">KG</td>
  </tr>
    
    </thead>
  
  <tr></tr></table></div></body></html>

Open in new window

0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34978827
Got it...

Few moments :)

Sid
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34978844
Sample File Attached.

Is this what you want?

I am assigning picture of image2 from image1. You may assign any other picture if you want.

Sid

Code Used

Private Sub Image1_MouseMove(ByVal Button As Integer, _
ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
    Image2.Picture = Image1.Picture
    Image2.Visible = True
End Sub

Private Sub UserForm_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, _
ByVal X As Single, ByVal Y As Single)
   Image2.Visible = False
End Sub

Open in new window

Mouseover-Effect.xls
0
 
LVL 2

Author Comment

by:team2005
ID: 34978912
Hi!

No, this is not what i want.

I want to use showtrial script
But cant find the script in google...

But i can use html insted of excel...

Please sombody tell me where to download this script

0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34978937
1) Do you want to do this in Excel or HTML?
2) You said that you want a bigger picture when you mouse over a small picture?

I am sorry, I am not able to understand you.

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34978980
Hi!

I was first asking if the script -> showtrial
Can be used in excel...

But if not, i can use html insted...

Have found java script now, include this
But cant get it to work ?


<script language = "javascript">

/*Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact
*/

var offsetfrommouse=[15,-25];
//image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0;
//duration in seconds image should remain visible. 0 for always.

var currentimageheight = 170;      // maximum image size.
if (document.getElementById || document.all){
      document.write('<div id="trailimageid">');
      document.write('</div>');
}

function gettrailobj(){
if (document.getElementById)
      return document.getElementById("trailimageid").style
else if (document.all)
      return document.all.trailimagid.style
}

function gettrailobjnostyle(){
      if (document.getElementById)
            return document.getElementById("trailimageid")
      else if (document.all)
            return document.all.trailimagid
}

function truebody(){
      return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function showtrail(imagename, imagenum, license, caption, showthumb, brand, imageid){
      //Only do this if the person wants it
      if(document.hoverForm.showComp.selectedIndex==0) {
            if (imageid > 0) {
                  var width = getImageWidth(imageid);
                  var height = getImageHeight(imageid);
            }
            //if (height > 0){
                  //      currentimageheight = height;
            //}
            //alert(getImageHeight(imageid));
            //alert(currentimageheight);
            document.onmousemove=followmouse;
            newHTML = '<div style="padding: 5px; background-color: #FFF; border: 1px solid #888;">';
            
            if (showthumb > 0){
                  newHTML = newHTML + '<div align="center" style="padding: 8px 2px 2px 2px;"><img src="' + imagename + '" border="0"></div>';
            }

            newHTML = newHTML + '<b>' + brand + '</b><br>';

            newHTML = newHTML + '<span class="blah">Image# ' + imagenum + ' (' + license + ')</span><br>';
            newHTML = newHTML + '<span class="blah">' + unescape(caption) + '</span>';
            newHTML = newHTML + '</div>';

            gettrailobjnostyle().innerHTML = newHTML;
            gettrailobj().visibility="visible";
      }
}

function hidetrail(){
      if(document.hoverForm.showComp.selectedIndex==0) {
            gettrailobj().visibility="hidden"
            document.onmousemove=""
            gettrailobj().left="-500px"
      }
}

function followmouse(e){
      var xcoord=offsetfrommouse[0]
      var ycoord=offsetfrommouse[1]
      var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15
      var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(document.body.offsetHeight, window.innerHeight)
      
      //if (document.all){
            //gettrailobjnostyle().innerHTML = 'A = ' + truebody().scrollHeight + '<br>B = ' + truebody().clientHeight;
      //} else {

            //gettrailobjnostyle().innerHTML = 'C = ' + document.body.offsetHeight + '<br>D = ' + window.innerHeight;
      //}

      if (typeof e != "undefined"){
            if (docwidth - e.pageX < 300){
                  xcoord = e.pageX - xcoord - 286; // Move to the left side of the cursor
            } else {
                  xcoord += e.pageX;
            }
            if (docheight - e.pageY < (currentimageheight + 110)){
                  ycoord += e.pageY - Math.max(0,(110 + currentimageheight + e.pageY - docheight - truebody().scrollTop));
            } else {
                  ycoord += e.pageY;
            }
      } else if (typeof window.event != "undefined"){
            if (docwidth - event.clientX < 300){
                  xcoord = event.clientX + truebody().scrollLeft - xcoord - 286; // Move to the left side of the cursor
            } else {
                  xcoord += truebody().scrollLeft+event.clientX
            } if (docheight - event.clientY < (currentimageheight + 110)){
                  ycoord += event.clientY + truebody().scrollTop - Math.max(0,(110 + currentimageheight + event.clientY - docheight));
            } else {            
                  ycoord += truebody().scrollTop + event.clientY;
            }
      }

      var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15
      var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight)
      gettrailobj().left=xcoord+"px"
      gettrailobj().top=ycoord+"px"
}

</script>

''''''''''''''''HTML CODE ''''''''''''''''''''''

<tr>
    <td><img alt="Angry face" src="heland.gif" width="90" height="90"><a id="3" onmouseover      ="showtrail('http://www.test.com/images/3.jpg', '3', 'Test', 'Test description.', '1', 'TestTitle','3');" onmouseout=hidetrail(); href="link.aspx" >Test Link</a></td>
    <td align="middle">12030</td>
    <td>HEL KYLLING, 4STK, à ca2,5kg</td>
    <td align="middle">CA 10,00</td>
    <td align="middle">32</td>
    <td align="middle">KG</td>
  </tr>

But this dosent work ?

Open in new window

0
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 
LVL 30

Accepted Solution

by:
SiddharthRout earned 500 total points
ID: 34978993
AFAIK and I could be wrong, but you cannot use HTML or any other such scripts inside Excel.

You may use VB Code to achieve a similar functionality as I have already shown you above.

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34979005
Hi!

Ok, but used the script included on my last post.
But cant get this to work ?


0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34979017
You cannot do that in Excel. That is what I am trying to tell you...

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34979051
I know that, i want to make this in html
Included the code, but cant get this to work..
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34979067
In Html? What has Excel to do with this then?

Sid
0
 
LVL 2

Author Closing Comment

by:team2005
ID: 34979078
Thanks
0
 
LVL 2

Author Comment

by:team2005
ID: 34979085
Hi!

I wil move this to html channel now, you have answered to
me that this cant be done in excel. Ok
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34979091
Thanks for the points but I don't think I deserve it as your query is not solved yet?

Can you please answer my question in ID: 34979067?

Sid
      
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34979099
Where is the picture? In a userform in Excel? or a webpage?

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34979137
Hi!

Html page is located on web
0
 
LVL 30

Expert Comment

by:SiddharthRout
ID: 34979148
Ok and what has excel to do with it?

Sid
0
 
LVL 2

Author Comment

by:team2005
ID: 34979165
Ok, please just forget this.

You dont anderstand...

Move this to html channel
0

Featured Post

Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

Join & Write a Comment

Introduction While answering a recent question (http:/Q_27311462.html), I created an alternative function to the Excel Concatenate() function that you might find useful.  I tested several solutions and share the results in this article as well as t…
Improved? Move/Copy Add-in Replacement - How to avoid the annoying, “A formula or sheet you want to move or copy contains the name XXX, which already exists on the destination worksheet.” David Miller (dlmille)  It was one of those days… I wa…
This Micro Tutorial demonstrates how to create Excel charts: column, area, line, bar, and scatter charts. Formatting tips are provided as well.
This Micro Tutorial will demonstrate how to use longer labels with horizontal bar charts instead of the vertical column chart.

760 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

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now