Solved

Possible to use showtrail in excel

Posted on 2011-02-16
23
330 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
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 
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
 
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

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
.Range Set 25 74
Problem to cell option 1 28
Dropbox in Windows Server 2008 4 26
VBA question, how many data set exists in the sheet 14 53
Approximate matching with VLOOKUP and MATCH seems to me to be a greatly under-used technique, and one which is vital for getting good performance out of large lookups. Until recently I would always have advised using an exact match for simplicity an…
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…
The view will learn how to download and install SIMTOOLS and FORMLIST into Excel, how to use SIMTOOLS to generate a Monte Carlo simulation of 30 sales calls, and how to calculate the conditional probability based on the results of the Monte Carlo …
This Micro Tutorial will demonstrate in Google Sheets how to use the HYPERLINK function to create live links inside your spreadsheet.

816 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

11 Experts available now in Live!

Get 1:1 Help Now