Posts

Calculate percentage of a specific element has been scrolled into visible on the screen

Image
HTML <div class='info-container flex-layout'>   <span>Scroll down</span>   <span class='percent'>0%</span> </div> <div class='block'></div> <div class='element flex-layout'>   <span>Start</span>   <span>End</span> </div> <div class='block'></div> CSS body {   margin: 0;   padding: 0;   color: white; } .flex-layout {   display: flex;   flex-direction: column;   justify-content: space-between; } .info-container {   position: fixed;   z-index: 1;   font-size: 2em;   height: 100%;   width: 100%;   align-items: flex-end;   color: white; } .block {   height: 1000px;   background: #333; } .element {   align-items: center;   background: #000;   height: 450px; } JavaScript $(document).ready(function() {   $(window).scroll(function() {     var windowBottom = $(this).scrollTop() + $(this).height();     var elementTop = $(".element").offset().to

JavaScript calculate percentage when user scroll web page

Image
<!doctype html> <html> <head>     <title>Color Changing</title>     <style type="text/css">         #percentage         {             position: fixed;         }     </style> </head> <body>     <div id="percentage"></div>     <div style="height: 4000px;"></div> </body> <script type="text/javascript">     window.onscroll = function(){         var heightOfWindow = window.innerHeight;         var contentScrolled = window.pageYOffset;         var bodyHeight = window.document.getElementsByTagName("body")[0].offsetHeight;         if(bodyHeight - contentScrolled <= heightOfWindow)        {            window.document.getElementById("percentage").innerHTML = "100%";        }        else        {            var total = bodyHeight - heightOfWindow;            var got = contentScrolled;            window.d

Kentico Visible Webpart on parent page and hidden on child page

This should be returning true and display the field when I'm on this page /My-Parent/Tester and will hidden this page when page is /My-Parent. {% if(CurrentDocument.NodeLevel == 1 && ViewMode == "LiveSite") { return false; } #%}

Kentico Smart Search filter query by month name

;with CteMonths(n, m) AS( SELECT 1, 'January' UNION ALL SELECT 2, 'February' UNION ALL SELECT 3, 'March' UNION ALL SELECT 4, 'April' UNION ALL SELECT 5, 'May' UNION ALL SELECT 6, 'June' UNION ALL SELECT 7, 'July' UNION ALL SELECT 8, 'August' UNION ALL SELECT 9, 'September' UNION ALL SELECT 10, 'October' UNION ALL SELECT 11, 'November' UNION ALL SELECT 12, 'December' ) SELECT '+StartDate' AS StartDate, '[' + REPLACE(REPLACE(REPLACE(convert(varchar(250), DATEADD(MONTH, n - 1, DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()), 0)), 120),'-',''),':',''),' ','') + ' TO ' + REPLACE(REPLACE(REPLACE(convert(varchar(250), DATEADD(DAY, -1, DATEADD(MONTH, n, DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()), 0))), 120),'-',''),':',''),' ','') + 

Getting the metadata descriptions of a page via macro expression

If you have defined the descriptions to pages and if any page inherits page descriptions form its parent, the macro would return null. Pleas use following macros instead: {% DocumentContext.CurrentDescription %} If you have defined the descriptions to pages and if any page not inherits page descriptions form its parent. Pleas use following macros instead: {% CurrentDocument.DocumentPageDescription %}

Conut document have children that are show in navigation

if(Documents[CurrentDocument.NodeAliasPath].Children.WithAllData.Where("ClassName = 'cms.menuitem' AND DocumentMenuItemHideInNavigation = 0").Count > 0) { true } else { false } OR if(Documents[NodeAliasPath].Children.Where("ClassName = 'CMS.MenuItem' AND DocumentMenuItemHideInNavigation = 0").Count > 0) { true } else { false }

Custom OpenCart 2.3.0.2 theme

Image
I was looking to customize the default theme in OpenCart 2.3.0.2 and realized that I will probably need to do quite a bit of work given there was no immediate “help” related on the subject. In essence it turned out to be a lot less painful than I thought. Here is what I did. Assuming new theme name “mytheme” and title “My Theme”. Make copies… To start with copy the  default  folder found in upload/catalog/view/theme/default to a new folder in the same directory. Name it “ mytheme “. Then copy the  theme_default.php  file in upload/admin/controller/extension/theme and place it in same directory. Name it “ mytheme.php “. + Rename the class to (line 2): ControllerExtensionThemeMyTheme + Replace all “ theme_default ” text to “ mytheme “. Yes there are a lot (197). Copy the  theme_default.tpl  in upload/admin/view/template/extension/theme and place it in the same directory. Name it “ mytheme.tpl “. + Replace all “ theme_default ” text to “ mytheme “. (48) Cop