This blog explains about how can we make 'Service Catalog Shopping Cart Window' Scrollable in Service Now
Scenario: Let's say, My Catalog Item has 500 variables when I scroll down to bottom of the page, I wanted to have 'Shopping cart window' also should be scrollable along with scroll bar
Solution:
- Create the following Catalog client script
function onLoad() {
//Type appropriate comment here, and begin script below
!function(t){t.fn.jScroll=function(n){function o(t){this.min=t.offset().top,this.originalMargin=parseInt(t.css("margin-top"),10)||0,this.getMargin=function(n){var o=t.parent().height()-t.outerHeight(),r=this.originalMargin;return n.scrollTop()>=this.min&&(r=r+i.top+n.scrollTop()-this.min),r>o&&(r=o),{marginTop:r+"px"}}}var i=t.extend({},t.fn.jScroll.defaults,n);return this.each(function(){var n=t(this),r=window;t("div.cms_layout_container",window.parent.document).length>0&&(r=window.parent);var e=t(r);t("div.touch_scroll").length>0&&(e=t("div.touch_scroll"));var s=new o(n);e.scroll(function(){n.stop().animate(s.getMargin(e),i.speed)})})},t.fn.jScroll.defaults={speed:"slow",top:10}}(jQuery),$j("#sc_cart_contents").jScroll({top:20,speed:1500});
}
Scenario: Let's say, My Catalog Item has 500 variables when I scroll down to bottom of the page, I wanted to have 'Shopping cart window' also should be scrollable along with scroll bar
Solution:
- Create the following Catalog client script
function onLoad() {
//Type appropriate comment here, and begin script below
!function(t){t.fn.jScroll=function(n){function o(t){this.min=t.offset().top,this.originalMargin=parseInt(t.css("margin-top"),10)||0,this.getMargin=function(n){var o=t.parent().height()-t.outerHeight(),r=this.originalMargin;return n.scrollTop()>=this.min&&(r=r+i.top+n.scrollTop()-this.min),r>o&&(r=o),{marginTop:r+"px"}}}var i=t.extend({},t.fn.jScroll.defaults,n);return this.each(function(){var n=t(this),r=window;t("div.cms_layout_container",window.parent.document).length>0&&(r=window.parent);var e=t(r);t("div.touch_scroll").length>0&&(e=t("div.touch_scroll"));var s=new o(n);e.scroll(function(){n.stop().animate(s.getMargin(e),i.speed)})})},t.fn.jScroll.defaults={speed:"slow",top:10}}(jQuery),$j("#sc_cart_contents").jScroll({top:20,speed:1500});
}
Thanks for sharing valuable information and very well explained. Keep posting.
ReplyDeleteservicenow admin training online
servicenow online training in India
Thank you for sharing this article,it is will be helpful and very Unique..
ReplyDeleteKeep updating...
ServiceNow Developer Training