SharePoint Popup Contextual Images

Also known as the 'hover over for screenshot' functionality.  This is a nice jquery driven code snippet that will take any link on your SharePoint page that has an image as its url and allow the user to simply hover over the link to see the image.

This has come in handy for providing contextual help in the form of screenshots right in with content.  A dead simple implementation might look like the following with a hyperlink column in your list and that being the only element in the view.

Yielding this type of thing when you hover over a link on your page:

Otherwise this just requires a reference to your local jquery file (or maybe not local, do what you want cowboy).

<script type="text/javascript" src="jquery.min.js"></script></span></div>
<script type="text/javascript"></span></div>
<br /></span></div>
function imagePreview(){</span></div>
arrOfImageTypes = ['jpg','jpeg','gif','png'];</span></div>
 $("table.ms-listviewtable td.ms-vb2 a").hover(function(e){</span></div>
 var href = this.href;</span></div>
 var img = href.substring(href.lastIndexOf('.')+1).toLowerCase();</span></div>
 if(href.indexOf('http')==0 && $.inArray(img,arrOfImageTypes)>-1){</span></div>
    $("body").append("<img id='preview' src='"+ this.href +"' alt='Image preview' />");</span></div>
 }</span></div>
 var obj = $("#preview");</span></div>
 var offset = $(this).offset();</span></div>
 var winHeight = $(window).height();</span></div>
 var winWidth = $(window).width();</span></div>
 var scrollLeft = $(window).scrollLeft();</span></div>
 var scrollTop = $(window).scrollTop();</span></div>
 var objHeight = obj.outerHeight();</span></div>
 var objWidth = obj.width()+15;</span></div>
 if(((winWidth+scrollLeft)-offset.left)<objWidth){</span></div>
 offset.left=((winWidth+scrollLeft)-objWidth);</span></div>
 }</span></div>
 var maxHeight = (winHeight+scrollTop)-offset.top;</span></div>
 if(objHeight>maxHeight){</span></div>
 if(offset.top-scrollTop>objHeight){</span></div>
 offset.top=offset.top-objHeight-20;</span></div>
 }</span></div>
 height = (objHeight<winHeight)?objHeight:winHeight;</span></div>
 }</span></div>
 obj.css({"position":"absolute","top":(offset.top+20)+"px","left":(offset.left+20),"border":"1px solid black"})</span></div>
 .fadeIn("fast");</span></div>
 },</span></div>
 function(){</span></div>
 $("#preview").remove();</span></div>
 });</span></div>
};</span></div>
<br /></span></div>
// Call the script on page load</span></div>
$(document).ready(function(){</span></div>
 imagePreview();</span></div>
});</span></div>
</script></span></div>

Google Stock Ticker for SharePoint

We looked at a number of controls to add a stock ticker to our intranet after it was requested that we do so. We looked at a few paid versions, considered building our own and in the end settled for using Google's phenomonal API for stock data.  Sure it is 15 minutes delayed so day trades should go find a version that you pay for.

Sample yerself some XML results here: http://www.google.com/ig/api?stock=.INX  You'll see in line 275 of the attached web part where the call to Google's API lives and can me modified.

SharePoint comes with a great data view web part that we just fed the Google output into, did a little visual tweaking to meet the space constraits we had and we were done.  Elegant, reliable, cheap.   Win.

I attached the exported web part that we used that you can import as a starting point if you'd like or if you want a little more control you can just build your own and not spend much more time in the process.

stock_ticker.webpart

Code – Disabling the Enter Key on Web-Forms

An old entry from a few years back, it had a number of hits so it may be useful, qualified for migration...

I got burned a while back by not having this in place when the submit button in a web-app only appeared under certain circumstances. Place this in the top of a web page to squelch the ENTER key in an INPUT=TEXT in your form. Then they gotta use the button when you say that the time is right =)

<script type="text/javascript">

function stopRKey(keyp) {
  var keyp = (keyp) ? keyp : ((event) ? event : null);
  var node = (keyp.target) ? keyp.target : ((keyp.srcElement) ? keyp.srcElement : null);
  if ((keyp.keyCode == 13) && (node.type=="text"))  {return false;}
}

document.onkeypress = stopRKey;

</script>