Tech
Forums
Jobs
Books
Events
Videos
Live
More
Interviews
Certification
Training
Career
Members
News
Blogs
Contribute
An Article
A Blog
A Video
An Ebook
An Interview Question
Collapse
Feed
Dashboard
Wallet
Learn
Achievements
Network
Rewards
SharpGPT
Premium
Register
Login
Angular 2 - Class Binding and Style Binding
</div> <div id="ctl00_MainContent_divTagsBox" class="tech-tags-list tags_recommended"><a class="tags-link" href='/videos/tag/angular-2' >Angular 2</a><a class="tags-link" href='/videos/tag/class-binding' >Class Binding</a><a class="tags-link" href='/videos/tag/style-binding' >Style Binding</a></div> <div class="cotent-share-icon social-media-dropdown btn-filter-ctrl btn-icon-dots icon-three-dots"> <a href="javascript:void(0);" class="btn-icon-dots"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-three-dots-vertical" viewBox="0 0 16 16"> <path d="M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z" /> </svg> </a> <ul id="IconContainer" data-content-type="Video" class="svg-dropdown-icon-dropdown-list"> <li><a title="Share on Facebook" href='https://www.facebook.com/sharer.php?u=http://goo.gl/8CO7I2' onclick="popupwindowAtCenter(this.href,'Share on Facebook',600,600);return false;" target="_blank" data-track> <svg width="16" height="16" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2916_102)"> <path d="M5.6116 1.42998H6.3944V0.000824067H4.97183C4.85316 -0.0041137 3.40656 -0.0317651 3.03162 1.39805C3.02619 1.41302 2.90636 1.75307 2.90636 2.54739L1.60559 2.55134V4.05028L2.90801 4.0465V8.00017H4.89743V4.04995H6.21417V2.54706H4.89743V2.07419C4.89743 1.78023 5.02137 1.42998 5.6116 1.42998ZM5.88499 2.87608V3.72061H4.56825V7.67082H3.23719V3.71633L1.93478 3.72011V2.87954L3.24065 2.87575L3.23719 2.70836C3.22007 1.86697 3.34006 1.5131 3.34549 1.49614C3.66908 0.264665 4.90468 0.326552 4.95767 0.329844L6.06521 0.330173V1.10096H5.6116C4.84246 1.10096 4.56841 1.60362 4.56841 2.07403V2.87608H5.88499Z" fill="#7F8AAB" /> </g><defs><clipPath id="clip0_2916_102"><rect width="16" height="16" fill="white" /></clipPath> </defs></svg> </a> </li> <li><a title="Share on Twitter" href='https://twitter.com/intent/tweet?via=CsharpCorner&related=CsharpCorner&text=Angular+2+-+Class+Binding+and+Style+Binding http://goo.gl/8CO7I2 by @rahulsahay19' target="_blank" data-track> <svg width="14" height="14" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2915_63)"> <path d="M4.74473 3.38745L7.65887 0H6.96831L4.43796 2.94128L2.41698 0H0.0860138L3.14214 4.44773L0.0860138 8H0.776611L3.44873 4.89391L5.58303 8H7.91399L4.74456 3.38745H4.74473ZM3.79886 4.48692L3.48921 4.04403L1.02544 0.519869H2.08616L4.07445 3.36398L4.3841 3.80687L6.96863 7.50377H5.90792L3.79886 4.48709V4.48692Z" fill="#7F8AAB" /> </g><defs><clipPath id="clip0_2915_63"><rect width="16" height="16" fill="white" /></clipPath> </defs></svg> </a></li> <li> <a class="icon-linkedIn-2" title="Share on Linkedin" href='https://www.linkedin.com/shareArticle?mini=true&url=http://goo.gl/8CO7I2' onclick="popupwindowAtCenter(this.href,'Share on LinkedIn',600,600);return false;" target="_blank" data-track> <svg width="16" height="16" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2915_80)"> <path d="M1.08 0.0666656C0.786672 0.0666656 0.52 0.173338 0.32 0.373338C0.106672 0.586666 0 0.853322 0 1.13332C0 1.42665 0.12 1.69332 0.32 1.89332C0.52 2.09332 0.8 2.21332 1.06667 2.19999C1.06667 2.19999 1.08 2.19999 1.09334 2.19999C1.36002 2.19999 1.61334 2.09332 1.81334 1.89332C2.01334 1.69332 2.13334 1.42665 2.13334 1.13332C2.14667 0.853322 2.02667 0.58665 1.82667 0.38665C1.62667 0.173322 1.36 0.0666656 1.08 0.0666656ZM1.62667 1.70667C1.48 1.85334 1.28 1.94667 1.06667 1.93334C0.866672 1.93334 0.653344 1.85334 0.506672 1.70667C0.346672 1.55999 0.266672 1.34667 0.266672 1.13334C0.266672 0.920009 0.346672 0.720009 0.506672 0.560009C0.653344 0.413338 0.853344 0.333338 1.08 0.333338C1.28 0.333338 1.48 0.413338 1.62667 0.560009C1.78667 0.720009 1.86667 0.920009 1.86667 1.13334C1.86667 1.34667 1.78667 1.55999 1.62667 1.70667Z" fill="#B2BBD6" /> <path d="M1.6 2.46666H0.520003C0.306675 2.46666 0.133331 2.63999 0.133331 2.86666V7.53333C0.133331 7.74666 0.320003 7.93333 0.533331 7.93333H1.6C1.81333 7.93333 2 7.74666 2 7.54666V2.86666C2 2.65332 1.81333 2.46666 1.6 2.46666ZM1.73333 7.54666C1.73333 7.61333 1.66666 7.66666 1.6 7.66666H0.533331C0.466659 7.66666 0.400003 7.59999 0.400003 7.53333V2.86666C0.400003 2.79999 0.453331 2.73333 0.520003 2.73333H1.6C1.66668 2.73333 1.73333 2.8 1.73333 2.86666V7.54666Z" fill="#B2BBD6" /> <path d="M6.13334 2.33333H5.85334C5.33334 2.33333 4.84001 2.56 4.52001 2.92V2.73333C4.52001 2.6 4.38668 2.46666 4.25334 2.46666H2.92001C2.80001 2.46666 2.65334 2.57333 2.65334 2.71998V7.69331C2.65334 7.83998 2.80001 7.93331 2.92001 7.93331H4.38668C4.50668 7.93331 4.65335 7.83998 4.65335 7.69331V4.81331C4.65335 4.37331 4.97335 4.02664 5.38668 4.02664C5.60001 4.02664 5.80001 4.10664 5.94668 4.25331C6.08001 4.37331 6.13335 4.55998 6.13335 4.79998V7.66666C6.13335 7.79998 6.26668 7.93333 6.40002 7.93333H7.73335C7.86668 7.93333 8.00002 7.8 8.00002 7.66666V4.22666C8.00001 3.16 7.18668 2.33333 6.13334 2.33333ZM7.73334 7.65333L7.72001 7.66666H6.41334L6.40001 4.8C6.40001 4.48 6.32001 4.24 6.14668 4.06667C5.94668 3.86667 5.68001 3.76 5.40001 3.76C4.84001 3.77333 4.40001 4.22667 4.40001 4.81333V7.66666H2.93334V2.73333H4.25334L4.26666 2.74666V3.58666L4.62666 3.22666L4.63999 3.21333C4.90666 2.84 5.37332 2.6 5.86666 2.6H6.14666C7.03999 2.6 7.73334 3.32 7.73334 4.22667V7.65333Z" fill="#B2BBD6" /> </g><defs><clipPath id="clip0_2915_80"><rect width="16" height="16" fill="white" /></clipPath> </defs></svg> </a></li> <li><a class="icon-reddit" title="Share on Reddit" href='//www.reddit.com/submit?title=Angular+2+-+Class+Binding+and+Style+Binding&url=https://test.c-sharpcorner.com//article/angular-2-class-binding-and-style-binding/' onclick="popupwindowAtCenter(this.href,'Share on Reddit',600,600);return false;" target="_blank" data-track> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="16" height="16" x="0" y="0" viewBox="0 0 31.553 31.552" style="enable-background: new 0 0 512 512" xml:space="preserve" class=""> <g> <circle cx="11.079" cy="17.836" r="2.126" fill="#7F8AAB" opacity="1" data-original="#000000" class="" /> <path d="M31.553 16.116c0-2.627-2.068-4.764-4.61-4.764-.892 0-1.72.27-2.425.722-2.187-1.27-4.945-2.059-7.957-2.167l1.736-4.984 3.596.861c-.012.119-.035.233-.035.355a3.6 3.6 0 0 0 3.596 3.595c1.98 0 3.596-1.612 3.596-3.595s-1.615-3.595-3.596-3.595c-1.293 0-2.417.69-3.05 1.715l-5.142-1.23-2.4 6.888c-2.998.154-5.727.99-7.873 2.294.043-.03.08-.064.123-.094a4.487 4.487 0 0 0-2.501-.766c-2.543 0-4.61 2.136-4.61 4.764a4.77 4.77 0 0 0 2.312 4.104c.564 4.912 6.419 8.789 13.549 8.789 7.176 0 13.061-3.929 13.559-8.886a4.79 4.79 0 0 0 2.132-4.006zm-6.101-11.97c1.099 0 1.994.895 1.994 1.995a1.996 1.996 0 0 1-3.99 0c0-1.101.896-1.995 1.996-1.995zM4.61 12.952c.363 0 .705.079 1.027.203-1.74 1.395-2.909 3.145-3.261 5.077a3.246 3.246 0 0 1-.778-2.116c0-1.744 1.352-3.164 3.012-3.164zM15.86 27.41c-6.621 0-12.006-3.572-12.006-7.963 0-4.392 5.385-7.963 12.006-7.963 6.62 0 12.004 3.572 12.004 7.963 0 4.39-5.384 7.963-12.004 7.963zm13.445-9.352c-.393-1.88-1.559-3.581-3.272-4.941a2.82 2.82 0 0 1 .91-.165c1.659 0 3.01 1.419 3.01 3.164a3.257 3.257 0 0 1-.648 1.942z" fill="#7F8AAB" opacity="1" data-original="#000000" class="" /> <circle cx="20.221" cy="17.836" r="2.126" fill="#7F8AAB" opacity="1" data-original="#000000" class="" /> <path d="M19.879 22.562c-4.504 2.973-8.138.172-8.3.045a.799.799 0 1 0-1.003 1.246c.03.025 2.106 1.657 5.121 1.657 1.499 0 3.232-.405 5.062-1.612a.8.8 0 0 0-.88-1.336z" fill="#7F8AAB" opacity="1" data-original="#000000" class="" /> </g></svg> </a></li> <li><a href="https://test.c-sharpcorner.com/userregistration/logincheck.aspx?returnurl=https://test.c-sharpcorner.com/articles/emailtofriend.aspx?articleid=59a5e3a2-bb3e-4452-8655-bf57174ec59d" id="ctl00_MainContent_ImageButtonEmail" cliendidmode="static" title="Email this video article to friend" class="icon-email"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#7F8AAB" class="bi bi-envelope" viewBox="0 0 16 16"> <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1zm13 2.383-4.708 2.825L15 11.105zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741M1 11.105l4.708-2.897L1 5.383z" /> </svg> </a></li> <li id="ListBookmarContent"><a href="https://test.c-sharpcorner.com/userregistration/logincheck.aspx?returnurl=https://test.c-sharpcorner.com/article/angular-2-class-binding-and-style-binding/" id="ImageButtonAddToMyBookmarks" class="icon-bookmark-add" title="Bookmark this video" onclick="return AddToArticleBookmark();"></a></li> </ul> </div> <div class="vidoesViews-sec"> <div class="list-foot-action-ctrl"> <div class="action-item"> <a id="VideoHistory" class="videos-history-section" title="History"> <i class="icon-sprite-02 icon-time"></i> </a> <span id="PublishDate" class="time" title="Updated Date">8y</span> </div> <div title="Views" class="action-item"> <i class="icon-sprite-02 icon-views"></i> <span id="ViewCounts">3.3k </span> </div> <a title="Points" href="/members/rank.aspx?page=points-table" class="action-item"> <i class="icon-sprite-02 icon-token"></i> <span id="ctl00_MainContent_ContributionPoints_Points" class="tokens">500</span> </a> </div> <div class="content-actions" style="display: none;"> <ul id="TopStatsContainer2" class="user-action-list list-inline"> <li class="reader-level"><i id="ReaderLevel" class="d-icon icon-level-beginner" title="Beginner"></i></li> <li class="relative" title="Views"><i class="d-icon icon-view"></i> <span id="ViewCounts1" class="user-action-count">0</span> </li> <li class="relative" title="Comments"> <a href="javascript:void(0);" id="CommentIcon"> <i class="d-icon icon-comment2"></i> <span id="spanComments" class="user-action-count">0</span> </a> </li> </ul> </div> <div class="btnAction"> <div class="content-actions"> <ul id="TopStatsContainer" class="user-action-list list-inline"> <li class="topstatscontainer-item"> <a href="javascript:void(0);" id="btnLikeAnchor" class="d-icon icon-like like-button"></a> <a href="javascript:void(0);" id="AnchorEmotionPopup" class="user-action-count" onclick="getContentReactions('59a5e3a2-bb3e-4452-8655-bf57174ec59d','video');"> <span id="LabelLikeCount" class="user-action-count">1</span> </a> <ul id="emotionsContainer" class="emotions-wrapper list-inline"> <li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(1,"icon-e-like");' class='d-icon icon-e-like' data-toggle='tooltip' data-title="Like"></a><span></span><li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(2,"icon-e-love");' class='d-icon icon-e-love' data-toggle='tooltip' data-title="Love It"></a><span></span><li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(4,"icon-e-awesome");' class='d-icon icon-e-awesome' data-toggle='tooltip' data-title="Awesome"></a><span></span><li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(5,"icon-e-interesting");' class='d-icon icon-e-interesting' data-toggle='tooltip' data-title="Interesting"></a><span></span><li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(7,"icon-e-okay");' class='d-icon icon-e-okay' data-toggle='tooltip' data-title="It's Okay"></a><span></span><li class='relative'><a href='javascript:void(0);' onclick='reactByEmotion(8,"icon-e-poor");' class='d-icon icon-e-poor' data-toggle='tooltip' data-title="Thumbs Down"></a><span></span></ul> </li> </ul> </div> </div> </div> <div class="clearfix"></div> </div> </div> <div id="ctl00_MainContent_RecommendedVideo_recommendedvideos" class="videos-section"> <div class="heading"> <a href="/videos">Recommended Videos</a> <p class="view-all-link"> <a href="/videos"><i class="c-icon icon-view-all"></i></a> </p> </div> <div class="videoList"> <ul id="ulVideoList" class="box_sizing clearfix"> <li class="box_sizing"> <a title='Learning AngularJS in 2 Hours - Part 1' href='https://test.c-sharpcorner.com/UploadFile/746765/learning-angular-js-in-2-hours-1st-part/' class="videoItem video-container"><i class="videoSprite"></i> <img src='https://i.ytimg.com/vi/AWJgnrG5Jo0/mqdefault.jpg' title='Learning AngularJS in 2 Hours - Part 1' alt='Learning AngularJS in 2 Hours - Part 1'> </a> <h3><a title='Learning AngularJS in 2 Hours - Part 1' href='https://test.c-sharpcorner.com/UploadFile/746765/learning-angular-js-in-2-hours-1st-part/'">Learning AngularJS in 2 Hours - Part 1</a></h3> <a class="video-post-by" title='Rahul Sahay' href='/members/rahul-sahay3'>Rahul Sahay</a> <div class="list-foot-action-ctrl card_footer_videos"> <div title="Updated Date" class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">9y</span></div> <div title="Views" class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">55.9k</span></div> <a title="Points" href="/members/rank.aspx?page=points-table" class="action-item"> <i class="icon-sprite-02 icon-token"></i> <span id="ctl00_MainContent_RecommendedVideo_RepeaterTopVideos_ctl00_ContributionPoints_Points" class="tokens">500</span> </a> </div> </li> <li class="box_sizing"> <a title='Learning AngularJS in 2 Hours - Part 6' href='https://test.c-sharpcorner.com/UploadFile/746765/learning-angular-js-in-2-hours-6th-part/' class="videoItem video-container"><i class="videoSprite"></i> <img src='https://i.ytimg.com/vi/SxjFGE7L41E/mqdefault.jpg' title='Learning AngularJS in 2 Hours - Part 6' alt='Learning AngularJS in 2 Hours - Part 6'> </a> <h3><a title='Learning AngularJS in 2 Hours - Part 6' href='https://test.c-sharpcorner.com/UploadFile/746765/learning-angular-js-in-2-hours-6th-part/'">Learning AngularJS in 2 Hours - Part 6</a></h3> <a class="video-post-by" title='Rahul Sahay' href='/members/rahul-sahay3'>Rahul Sahay</a> <div class="list-foot-action-ctrl card_footer_videos"> <div title="Updated Date" class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">9y</span></div> <div title="Views" class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">12.5k</span></div> <a title="Points" href="/members/rank.aspx?page=points-table" class="action-item"> <i class="icon-sprite-02 icon-token"></i> <span id="ctl00_MainContent_RecommendedVideo_RepeaterTopVideos_ctl01_ContributionPoints_Points" class="tokens">500</span> </a> </div> </li> <li class="box_sizing"> <a title='Getting Started with Angular 2 Forms' href='https://test.c-sharpcorner.com/article/angular-2-forms/' class="videoItem video-container"><i class="videoSprite"></i> <img src='https://i.ytimg.com/vi/nV36Zlji3MI/mqdefault.jpg' title='Getting Started with Angular 2 Forms' alt='Getting Started with Angular 2 Forms'> </a> <h3><a title='Getting Started with Angular 2 Forms' href='https://test.c-sharpcorner.com/article/angular-2-forms/'">Getting Started with Angular 2 Forms</a></h3> <a class="video-post-by" title='Rahul Sahay' href='/members/rahul-sahay3'>Rahul Sahay</a> <div class="list-foot-action-ctrl card_footer_videos"> <div title="Updated Date" class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">8y</span></div> <div title="Views" class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">9.3k</span></div> <a title="Points" href="/members/rank.aspx?page=points-table" class="action-item"> <i class="icon-sprite-02 icon-token"></i> <span id="ctl00_MainContent_RecommendedVideo_RepeaterTopVideos_ctl02_ContributionPoints_Points" class="tokens">500</span> </a> </div> </li> </ul> </div> <div class="clearfix"></div> </div> <div class="post-wrap-new author-bio-content"> <div class="author-bio-img"> <a href="https://test.c-sharpcorner.com/members/rahul-sahay3" id="AuthorProfileLinkOnPhoto" class="image"> <img src="https://test.c-sharpcorner.com/UploadFile/AuthorImage/74676520141215091613.jpg.ashx?width=55&height=55" id="ImgAuthor" class="img-circle img-author" alt="Rahul Sahay" title="Rahul Sahay" /> </a> </div> <div class="author-media"> <div class="form-group"> <div class="d-flex"> <a id="AuthorLinkForName" class="author-profile-link"> <span id="ctl00_MainContent_AuthorProfileLinkForName" class="u-name">Rahul Sahay</span> </a> </div> </div> <div id="AuthorBioDetails" class="bio-info" style="display: none"></div> <div id="ArticleSummary" class="author-bio-info"></div> </div> </div> <div class="clear"></div> <div id="div1" class="content-header" style="display: none;"> <div class="media"> <div class="media-left media-top hidden-xs"> <a href="https://test.c-sharpcorner.com/technologies/angularjs" id="CategoryLink"> </a> </div> <div class="media-body"> </div> </div> <div id="ctl00_MainContent_ad728X90" style="clear: both; padding: 5px;"> <div id='CsharpCorner_2019_728X90'></div> </div> </div> <div class="user-content"> <div class="b-row" style="padding: 0 15px; display: none;"> <div class="content-head-link clearfix"> <div class="ad-items linkAdContainer" id="LinkAdContainerTop"> </div> </div> </div> <div id="div2"> <span id="ctl00_MainContent_LabelResourceDetail"></span> </div> </div> <div class="linkAdContainer bottom" id="LinkAdContainerBottom" style="display: none;"> </div> <div id="OurEbooks1" style="display: none;"></div> <div id="ctl00_MainContent_CommentsBox" class="commentsContainer" style="display: none;"></div> </div> <input type="hidden" name="ctl00$MainContent$hddMinorCategoryName" id="hddMinorCategoryName" value="Angular" /> <input type="hidden" name="ctl00$MainContent$HDDUrl" id="HDDUrl" /> <input type="hidden" name="ctl00$MainContent$hiddenFieldNext" id="ctl00_MainContent_hiddenFieldNext" /> <input type="hidden" name="ctl00$MainContent$hiddenFieldPrevious" id="ctl00_MainContent_hiddenFieldPrevious" /> <input type="hidden" name="ctl00$MainContent$HiddenFieldCurrentPageUrl" id="ctl00_MainContent_HiddenFieldCurrentPageUrl" value="http://goo.gl/8CO7I2" /> <input type="hidden" name="ctl00$MainContent$hddArticleID" id="hddArticleID" value="59a5e3a2-bb3e-4452-8655-bf57174ec59d" /> <input type="hidden" name="ctl00$MainContent$hddRawUrl" id="hddRawUrl" value="/article/angular-2-class-binding-and-style-binding/" /> <input type="hidden" name="ctl00$MainContent$hiddenFieldReturnUrl" id="hiddenFieldReturnUrl" value="https://test.c-sharpcorner.com/userregistration/logincheck.aspx?returnurl=https://test.c-sharpcorner.com/article/angular-2-class-binding-and-style-binding/" /> <input type="hidden" name="ctl00$MainContent$HiddenAuthorId" id="HiddenAuthorId" value="746765" /> <input type="hidden" name="ctl00$MainContent$HiddenFiledContentTitle" id="HiddenFiledContentTitle" value="Angular 2 - Class Binding and Style Binding" /> <input type="hidden" name="ctl00$MainContent$HiddenContentType" id="HiddenContentType" value="article" /> <input type="hidden" name="ctl00$MainContent$HiddenUserRole" id="HiddenUserRole" /> <input type="hidden" name="ctl00$MainContent$HiddenIsContentApproved" id="HiddenIsContentApproved" value="true" /> <input type="hidden" name="ctl00$MainContent$HiddenIsAllowPost" id="HiddenIsAllowPost" value="true" /> <input name="ctl00$MainContent$HiddenContentShortDescription" type="hidden" id="HiddenContentShortDescription" value="In this video, I will talk about Class and Style Binding in Angular 2." /> <input type="hidden" name="ctl00$MainContent$hiddenLastStopTime" id="hiddenLastStopTime" /> <input type="hidden" name="ctl00$MainContent$HiddenFieldVideos" id="HiddenFieldVideos" value="Videos" /> <style> .overlay-bg-response-alert { background-color: rgba(0, 0, 0, .5); width: 100%; height: 100%; position: fixed; top: 0; bottom: 0; left: 0; z-index: 9999; } .popup-window-response-alert { margin: auto; position: relative; top: 100px; background-color: var(--popupBg); height: auto; max-height: 660px; overflow: hidden; overflow-y: auto; width:fit-content; max-width: 520px; } .popup-wrap-response-alert { padding: 0px 20px 0px 20px; } .popup-header-response-alert { text-align: center; background-color: var(--popupBg); padding-top: 10px; line-height: 30px; font-size: 18px; color: var(--texthightlight); font-weight: bold; position: sticky; top: 0px; } .popup-heading-response-alert, .popup-heading-response-alert > span { padding: 10px; font-size: 18px; font-weight: 500; margin-bottom: 0px; text-transform: capitalize; } .PopupContent-response .icon-close { cursor: pointer; } .PopupContent-response .icon-close::before { transform: rotate(45deg); } .PopupContent-response .icon-close::before, .PopupContent-response .icon-close::after { content: ""; display: block; position: absolute; top: 28px; right: 30px; background-color: #ffffff; width: 20px; height: 3px; border-radius: 2px; } .PopupContent-response .icon-close::after { transform: rotate(-45deg); } .popup-body-response-alert { overflow-y: auto; display: flex; justify-content: center; padding: 12px 24px; align-items: center; } .messagebody-alert { font-size: var(--FontSize16); font-weight: 300; } .popup-footer-response-alert { width: auto; text-align: center; padding: 12px 0; position: relative; } #PopUp-body-alert { display: none; } .popup-footer-response-alert{ display:flex; justify-content:center; gap:10px; } .btn_alert { color: #fff; margin:5px 0px 0px; padding: 5px 20px; border: none; font-size:14px; border-radius: 40px; cursor: pointer; text-align: center; text-decoration: none; display: inline-block; transition: background-color 0.3s; } @media screen and (max-width: 1023px) { .popup-window-response-alert { max-width: 90%; } } .light-mode .icon-close:hover::before, .light-mode .icon-close:hover::after { background-color: #000; } </style> <div class="PopupContent-response" id="PopUp-body-alert"> <div id="getStartedpopup_alert" class="overlay-bg-response-alert"> <div class="popup-window-response-alert"> <div class="popup-wrap-response-alert"> <div class="popup-header-response-alert"> <div class="popup-heading-response-alert"> <span id="MessageHeading">Message</span> </div> </div> <div id="btnFeedbackPopupClose_alert" class="icon-close" title="Close" data-dismiss="modal" onclick="hidePopupAlert()"></div> <div class="popup-body-response-alert"> <div class="messagebody-alert" id="messagebody_alert"></div> </div> <div class="popup-footer-response-alert"> <button id="btnsubmit_alert" type="button" class="btn_alert success-btn">OK</button> <button id="btncancel_alert" type="button" class="btn_alert danger-btn" onclick="hidePopupAlert()">Close</button> </div> </div> </div> </div> </div> <script> //function for both ok && cancel button function showPopupAlert(message, onConfirm) { document.getElementById('PopUp-body-alert').style.display = 'block'; // Set the message body text document.getElementById('messagebody_alert').innerHTML = message; // Ensure the buttons are visible document.getElementById('btnsubmit_alert').style.display = 'inline'; document.getElementById('btncancel_alert').style.display = 'inline'; // Set the on click event for the Submit button document.getElementById('btnsubmit_alert').onclick = function () { onConfirm(); document.getElementById('PopUp-body-alert').style.display = 'none'; // Hide the popup after confirmation }; // Set the on click event for the Cancel button document.getElementById('btncancel_alert').onclick = function () { document.getElementById('PopUp-body-alert').style.display = 'none'; // Hide the popup when cancel is clicked }; } //function for only ok button function showPopupMsg(message) { document.getElementById('PopUp-body-alert').style.display = 'block'; // Set the message body text document.getElementById('messagebody_alert').innerHTML = message; // Ensure the buttons are visible document.getElementById('btnsubmit_alert').style.display = 'inline'; document.getElementById('btncancel_alert').style.display = 'none'; // Set the on click event for the Cancel button document.getElementById('btnsubmit_alert').onclick = function () { document.getElementById('PopUp-body-alert').style.display = 'none'; // Hide the popup when cancel is clicked }; } function hidePopupAlert() { // Hide the popup document.getElementById('PopUp-body-alert').style.display = 'none'; } </script> </section> <aside class="aside-right"> <style> .video-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; /* height: 3em;*/ line-height: 1.5em; } .video-container-featured, .video-container-featured img { height: 79.99px !important; } .latest-video-listing > li:not(:first-child) { padding-top: 15px; } .foot-action-featured-videos { margin-top: 5px; } .latest-video-listing > li { gap: 15px; } .video-container-featured, .video-container-featured img { max-width: 142px !important; } </style> <div class="wrap wrap-transparent"> <div class="wrap-heading"> <div class="heading">Featured videos</div> <a href="/videos" class="btn-view-all">View all</a> </div> <div class="latest-video-wrap"> <ul id="TopVideosList" class="latest-video-listing"> <li title='Augmented Reality'> <a href='/article/augmented-reality2/'> <div class="video-container video-container-featured"> <img src='/article/augmented-reality2/media/mqdefault.jpg.ashx?height=180&width=320' alt='Augmented Reality' title='Augmented Reality'> </div> </a> <div class="video-rightside"> <a href='/article/augmented-reality2/'> <div class="video-title">Augmented Reality</div> </a> <div class="list-foot-action-ctrl foot-action-featured-videos"> <div title='Updated Date' class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">1w</span></div> <div title='Views' class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">66</span></div> </div> </div> </li> <li title='What Is Jira | Jira Explained in 3 minutes | Jira Tool For Beginners | Tannu'> <a href='/article/what-is-jira-jira-explained-in-3-minutes-jira-tool-for-beginners-tannu/'> <div class="video-container video-container-featured"> <img src='/article/what-is-jira-jira-explained-in-3-minutes-jira-tool-for-beginners-tannu/media/mqdefault.jpg.ashx?height=180&width=320' alt='What Is Jira | Jira Explained in 3 minutes | Jira Tool For Beginners | Tannu' title='What Is Jira | Jira Explained in 3 minutes | Jira Tool For Beginners | Tannu'> </div> </a> <div class="video-rightside"> <a href='/article/what-is-jira-jira-explained-in-3-minutes-jira-tool-for-beginners-tannu/'> <div class="video-title">What Is Jira | Jira Explained in 3 minutes | Jira Tool For Beginner...</div> </a> <div class="list-foot-action-ctrl foot-action-featured-videos"> <div title='Updated Date' class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">1w</span></div> <div title='Views' class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">89</span></div> </div> </div> </li> <li title='Current Affairs Video'> <a href='/article/current-affairs-video/'> <div class="video-container video-container-featured"> <img src='/article/current-affairs-video/media/mqdefault.jpg.ashx?height=180&width=320' alt='Current Affairs Video' title='Current Affairs Video'> </div> </a> <div class="video-rightside"> <a href='/article/current-affairs-video/'> <div class="video-title">Current Affairs Video</div> </a> <div class="list-foot-action-ctrl foot-action-featured-videos"> <div title='Updated Date' class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">1w</span></div> <div title='Views' class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">25</span></div> </div> </div> </li> <li title='Whats i s AWS Cloud. 😃'> <a href='https://test.c-sharpcorner.com/article/whats-i-s-aws-cloud/'> <div class="video-container video-container-featured"> <img src='https://test.c-sharpcorner.com/article/whats-i-s-aws-cloud/media/mqdefault.jpg.ashx?height=180&width=320' alt='Whats i s AWS Cloud. 😃' title='Whats i s AWS Cloud. 😃'> </div> </a> <div class="video-rightside"> <a href='https://test.c-sharpcorner.com/article/whats-i-s-aws-cloud/'> <div class="video-title">Whats i s AWS Cloud. 😃</div> </a> <div class="list-foot-action-ctrl foot-action-featured-videos"> <div title='Updated Date' class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">Oct 11</span></div> <div title='Views' class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">244</span></div> </div> </div> </li> <li title='What is DevOps? detailed explanation '> <a href='https://test.c-sharpcorner.com/article/what-is-devops/'> <div class="video-container video-container-featured"> <img src='https://test.c-sharpcorner.com/article/what-is-devops/media/mqdefault.jpg.ashx?height=180&width=320' alt='What is DevOps? detailed explanation ' title='What is DevOps? detailed explanation '> </div> </a> <div class="video-rightside"> <a href='https://test.c-sharpcorner.com/article/what-is-devops/'> <div class="video-title">What is DevOps? detailed explanation </div> </a> <div class="list-foot-action-ctrl foot-action-featured-videos"> <div title='Updated Date' class="action-item"><i class="icon-sprite-02 icon-time"></i><span class="time">Oct 11</span></div> <div title='Views' class="action-item"><i class="icon-sprite-02 icon-views"></i><span class="vidoesViews">281</span></div> </div> </div> </li> </ul> </div> </div> <div style="margin-bottom: 5px;" id="ezoic-pub-ad-placeholder-101"></div> <div class="sticky-ad"> <div id="ezoic-pub-ad-placeholder-103"></div> </div> </aside> </div> </main> <div id="NewFooter"> <footer class="main-footer"> <div class="inner-footer"> <div class="social-media-wrap"> <a title="Facebook" href="https://www.facebook.com/pages/C-Corner/194086953935286" target="_blank"> <svg width="26" height="30" viewBox="0 0 5 9" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M3.68729 1.81279H4.44389V0.540791C4.07757 0.50293 3.70949 0.484238 3.34119 0.484791C2.24655 0.484791 1.498 1.14879 1.498 2.36479V3.41279H0.262497V4.83678H1.498V8.48478H2.97899V4.83678H4.21047L4.3956 3.41279H2.97899V2.50479C2.97899 2.08479 3.09168 1.81279 3.68729 1.81279Z" fill="#636F92" /> </svg></a> <a title="Twitter" href="https://twitter.com/csharpcorner" target="_blank"> <svg width="26" height="30" viewBox="0 0 9 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M4.93819 3.38747L7.85233 1.52588e-05H7.16177L4.63143 2.94129L2.61044 1.52588e-05H0.27948L3.3356 4.44775L0.27948 8.00002H0.970077L3.64219 4.89393L5.7765 8.00002H8.10746L4.93802 3.38747H4.93819ZM3.99232 4.48694L3.68267 4.04404L1.21891 0.519884H2.27963L4.26791 3.36399L4.57756 3.80689L7.1621 7.50379H6.10138L3.99232 4.4871V4.48694Z" fill="#636F92" /> </svg> </a> <a title="LinkedIn" href="https://www.linkedin.com/company/csharpcorner/" target="_blank"> <svg width="26" height="30" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M1.79071 7.99982H0.132143V2.65875H1.79071V7.99982ZM0.960536 1.93018C0.430179 1.93018 0 1.49089 0 0.960536C3.79607e-09 0.705786 0.101199 0.46147 0.281334 0.281334C0.46147 0.101199 0.705786 0 0.960536 0C1.21529 0 1.4596 0.101199 1.63974 0.281334C1.81987 0.46147 1.92107 0.705786 1.92107 0.960536C1.92107 1.49089 1.49071 1.93018 0.960536 1.93018ZM7.99821 7.99982H6.34321V5.39982C6.34321 4.78018 6.33071 3.98554 5.48089 3.98554C4.61857 3.98554 4.48643 4.65875 4.48643 5.35518V7.99982H2.82964V2.65875H4.42036V3.38732H4.44357C4.665 2.96768 5.20589 2.52482 6.01286 2.52482C7.69143 2.52482 8 3.63018 8 5.06589V7.99982H7.99821Z" fill="#636F92" /> </svg> </a> <a title="Youtube" href="https://www.youtube.com/user/CsharpCorner1/" target="_blank"> <svg width="26" height="30" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M7.92031 2.40001C7.92031 2.40001 7.84219 1.84845 7.60156 1.60626C7.29688 1.28751 6.95625 1.28595 6.8 1.2672C5.68125 1.18595 4.00156 1.18595 4.00156 1.18595H3.99844C3.99844 1.18595 2.31875 1.18595 1.2 1.2672C1.04375 1.28595 0.703125 1.28751 0.398438 1.60626C0.157813 1.84845 0.08125 2.40001 0.08125 2.40001C0.08125 2.40001 0 3.04845 0 3.69533V4.30158C0 4.94845 0.0796875 5.59689 0.0796875 5.59689C0.0796875 5.59689 0.157812 6.14845 0.396875 6.39064C0.701563 6.70939 1.10156 6.69845 1.27969 6.73283C1.92031 6.79376 4 6.81251 4 6.81251C4 6.81251 5.68125 6.80939 6.8 6.7297C6.95625 6.71095 7.29688 6.70939 7.60156 6.39064C7.84219 6.14845 7.92031 5.59689 7.92031 5.59689C7.92031 5.59689 8 4.95001 8 4.30158V3.69533C8 3.04845 7.92031 2.40001 7.92031 2.40001ZM3.17344 5.03751V2.78908L5.33437 3.9172L3.17344 5.03751Z" fill="#636F92" /> </svg> </a> <a title="Windows App" href="https://www.microsoft.com/store/apps/9nblggh4tmwd?ocid=badge" target="_blank"> <svg width="26" height="30" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M3.65835 4.17363C3.66035 4.97319 3.66276 6.33168 3.66476 7.3875C5.11038 7.58299 6.55599 7.78452 7.9992 8C7.9992 6.73949 8.0008 5.4845 7.9992 4.28516C6.55238 4.28516 5.10597 4.17363 3.65835 4.17363ZM0 4.17402V6.88867C1.09033 7.03579 2.18065 7.1764 3.26897 7.33711C3.27098 6.28689 3.26817 5.23636 3.26817 4.18613C2.17865 4.18813 1.08952 4.17043 0 4.17402ZM0 1.1373V3.84434C1.09033 3.84714 2.18065 3.83064 3.27098 3.83184C3.27018 2.78401 3.27018 1.73747 3.26897 0.689648C2.17784 0.825972 1.08672 0.970197 0 1.1373ZM8 3.78867C6.55519 3.79427 5.11038 3.8163 3.66476 3.8207C3.66396 2.75569 3.66396 1.69195 3.66476 0.627734C5.10757 0.407454 6.55358 0.200288 7.9992 0C8 1.2633 7.9992 2.52537 8 3.78867Z" fill="#636F92" /> </svg> </a> <a title="Android App" href="https://play.google.com/store/apps/details?id=com.mcn.csharpcorner&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1" target="_blank"> <svg width="26" height="30" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2269_8265)"> <path d="M4.84795 4.04234L6.09669 2.81478L2.0633 0.586328C1.79598 0.444352 1.54556 0.424425 1.32596 0.579686L4.84795 4.04234ZM6.30953 5.47955L7.60768 4.76178C7.86106 4.62229 8 4.42468 8 4.20549C8 3.98672 7.86106 3.78869 7.60811 3.64921L6.43284 3.00035L5.10977 4.30056L6.30953 5.47955ZM1.1089 0.881491C1.08187 0.963273 1.06667 1.0546 1.06667 1.15465V7.25924C1.06667 7.41741 1.10214 7.55357 1.16633 7.66192L4.5857 4.30014L1.1089 0.881491ZM4.84795 4.55753L1.44758 7.90063C1.51262 7.92512 1.58272 7.93799 1.65662 7.93799C1.78838 7.93799 1.92563 7.8998 2.06541 7.82341L5.9738 5.66594L4.84795 4.55753Z" fill="#636F92" /> </g> <defs> <clipPath id="clip0_2269_8265"> <rect width="8" height="8" fill="white" /> </clipPath> </defs> </svg> </a> <a title="iOS App" href="https://itunes.apple.com/us/app/c-corner/id451080586?ls=1&mt=8" target="_blank"> <svg width="26" height="30" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_2269_8263)"> <path d="M5.31634 7.95867C5.072 7.95867 4.85434 7.876 4.64467 7.79733C4.465 7.729 4.29567 7.665 4.135 7.665C3.99234 7.665 3.82967 7.726 3.65734 7.79C3.449 7.867 3.213 7.95533 2.95667 7.95533C2.53534 7.95533 2.15767 7.714 1.80034 7.219C1.78534 7.198 0.330669 5.06167 1.03734 3.47533C1.42434 2.60667 1.982 2.16567 2.69467 2.16567C3.07067 2.16567 3.41767 2.28367 3.69634 2.37867C3.85234 2.43167 3.99967 2.48167 4.07734 2.48167C4.169 2.48167 4.31634 2.428 4.47134 2.37033C4.73 2.27533 5.05267 2.15633 5.42267 2.15633C5.959 2.15633 6.44434 2.404 6.907 2.91333C6.92261 2.93073 6.93443 2.95118 6.94172 2.97339C6.94901 2.99559 6.9516 3.01907 6.94934 3.04233C6.94676 3.06555 6.93943 3.08798 6.92778 3.10823C6.91614 3.12848 6.90044 3.1461 6.88167 3.16C6.394 3.51533 6.14667 3.92633 6.14667 4.382C6.14667 4.94633 6.42534 5.361 7.077 5.76667C7.1113 5.78781 7.13672 5.82073 7.1485 5.85926C7.16028 5.89779 7.15761 5.93929 7.141 5.976C6.52834 7.34667 5.96567 7.95867 5.31634 7.95867ZM4.093 2.07033C4.053 2.07033 4.01267 2.06767 3.973 2.063C3.93368 2.05832 3.89733 2.03971 3.87055 2.01054C3.84377 1.98137 3.82832 1.94358 3.827 1.904C3.783 0.788666 4.72834 0.105666 5.427 0.0423328C5.46851 0.0387972 5.50986 0.0507791 5.54304 0.0759615C5.57623 0.101144 5.5989 0.137738 5.60667 0.178666C5.68367 0.608 5.53967 1.08 5.21067 1.47333C4.898 1.84733 4.48 2.07033 4.093 2.07033Z" fill="#636F92" /> </g> <defs> <clipPath id="clip0_2269_8263"> <rect width="8" height="8" fill="white" /> </clipPath> </defs> </svg> </a> <a title="Contact Support" href="/notification/contactsupport.aspx" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" width="26" height="30" viewBox="0 0 17 16" fill="none"> <mask id="path-1-outside-1_1696_6758" maskUnits="userSpaceOnUse" x="0" y="0.777649" width="17" height="15" fill="black"> <rect fill="white" y="0.777649" width="17" height="15"></rect> <path fill-rule="evenodd" clip-rule="evenodd" d="M3 1.77765C1.89543 1.77765 1 2.67308 1 3.77765V10.4443C1 11.5489 1.89543 12.4443 3 12.4443H6.57141L7.95998 14.0477C8.03974 14.1398 8.1826 14.1398 8.26235 14.0477L9.65092 12.4443H13.2222C14.3268 12.4443 15.2222 11.5489 15.2222 10.4443V3.77765C15.2222 2.67308 14.3268 1.77765 13.2222 1.77765H3Z"></path> </mask> <path d="M6.57141 12.4443L7.32734 11.7897L7.02826 11.4443H6.57141V12.4443ZM7.95998 14.0477L7.20405 14.7024L7.20406 14.7024L7.95998 14.0477ZM8.26235 14.0477L9.01828 14.7024L9.01828 14.7024L8.26235 14.0477ZM9.65092 12.4443V11.4443H9.19407L8.89499 11.7897L9.65092 12.4443ZM2 3.77765C2 3.22536 2.44771 2.77765 3 2.77765V0.777649C1.34315 0.777649 0 2.12079 0 3.77765H2ZM2 10.4443V3.77765H0V10.4443H2ZM3 11.4443C2.44772 11.4443 2 10.9966 2 10.4443H0C0 12.1012 1.34315 13.4443 3 13.4443V11.4443ZM6.57141 11.4443H3V13.4443H6.57141V11.4443ZM5.81548 13.099L7.20405 14.7024L8.71591 13.393L7.32734 11.7897L5.81548 13.099ZM7.20406 14.7024C7.68258 15.2549 8.53976 15.2549 9.01828 14.7024L7.50643 13.393C7.82545 13.0247 8.39689 13.0247 8.71591 13.393L7.20406 14.7024ZM9.01828 14.7024L10.4069 13.099L8.89499 11.7897L7.50643 13.393L9.01828 14.7024ZM13.2222 11.4443H9.65092V13.4443H13.2222V11.4443ZM14.2222 10.4443C14.2222 10.9966 13.7745 11.4443 13.2222 11.4443V13.4443C14.8791 13.4443 16.2222 12.1012 16.2222 10.4443H14.2222ZM14.2222 3.77765V10.4443H16.2222V3.77765H14.2222ZM13.2222 2.77765C13.7745 2.77765 14.2222 3.22536 14.2222 3.77765H16.2222C16.2222 2.12079 14.8791 0.777649 13.2222 0.777649V2.77765ZM3 2.77765H13.2222V0.777649H3V2.77765Z" fill="#636F92" mask="url(#path-1-outside-1_1696_6758)"></path> <circle cx="8.11104" cy="7.1113" r="0.888889" fill="#636F92"></circle> <circle cx="4.55556" cy="7.11124" r="0.888889" fill="#636F92"></circle> <circle cx="11.6667" cy="7.1113" r="0.888889" fill="#636F92"></circle> <circle cx="15.2223" cy="1.77778" r="1.37778" fill="#B8C1DB" stroke="#636F92" stroke-width="0.8"></circle> </svg> </a> </div> <div class="footer-links"> <a title="About Us" href="https://test.c-sharpcorner.com/about" class="foot-item-link">About Us</a> <a title="Contact Us" href="https://test.c-sharpcorner.com/contactus.aspx" class="foot-item-link">Contact Us</a> <a title="Privacy Policy" href="https://test.c-sharpcorner.com/privacypolicy.aspx" class="foot-item-link">Privacy Policy</a> <a title="Terms" href="https://test.c-sharpcorner.com/termsconditions.aspx" class="foot-item-link">Terms</a> <a title="Media Kit" href="https://test.c-sharpcorner.com/media/contactus.aspx" class="foot-item-link">Media Kit</a> <a title="Partners" href="https://test.c-sharpcorner.com/partners.aspx" class="foot-item-link">Partners</a> <a title="C# Tutorials" href="https://test.c-sharpcorner.com/csharp-tutorials" class="foot-item-link">C# Tutorials</a> <a title="Consultants" href="https://consultants.c-sharpcorner.com/" class="foot-item-link" target="_blank">Consultants</a> <a title="Ideas" href="https://test.c-sharpcorner.com/ideas" class="foot-item-link">Ideas</a> <a title="Report a Bug" href="https://test.c-sharpcorner.com/report-bugs" class="foot-item-link">Report A Bug</a> <a title="FAQs" href="https://test.c-sharpcorner.com/faq" class="foot-item-link">FAQs</a> <a title="Certifications" href="https://test.c-sharpcorner.com/certification" class="foot-item-link">Certifications</a> <a title="Sitemap" href="https://test.c-sharpcorner.com/sitemap/" class="foot-item-link">Sitemap</a> <a title="Stories" href="https://test.c-sharpcorner.com/stories" class="foot-item-link">Stories</a> <a title="CSharp TV" href="https://test.c-sharpcorner.com/live" class="foot-item-link">CSharp TV</a> <a title="DB Talks" href="https://www.dbtalks.com/" class="foot-item-link" target="_blank">DB Talks</a> <a title="Let's React" href="https://www.letsreact.org/" class="foot-item-link" target="_blank">Let's React</a> <a title="Web3 Universe" href="https://web3universe.today/" class="foot-item-link" target="_blank">Web3 Universe</a> <a title="interviews.help" href="https://www.interviews.help/" class="foot-item-link" target="_blank">Interviews.help</a> <a title="Jumpstart Blockchain" href="https://www.jumpstartblockchain.com/" class="foot-item-link" target="_blank">Jumpstart Blockchain</a> <a title="Build with JavaScript" href="https://www.buildwithjavascript.com/" class="foot-item-link" target="_blank">Build with JavaScript</a> </div> <div class="copyright"> <p>©2024 C# Corner.</p> <p>All contents are copyright of their authors.</p> </div> </div> </footer> </div> <div class="aspNetHidden"> <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="E6D0DBF9" /> <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEdABZKY6tJwQGEwg5stWn0iwxK8tgt2KjyyiDhxtapMocmI++o/R2HzFhtDOGan4OOQdbudbs4LJNcB9ab7z6FlhH06JY78/QC/FT04CMiDCGbhkHMXgAz11bZoiQEU2Yj0LyFk61ZSmiGBkB2X5HmW5FLwAGICu1Nkktwh4BSif4/1CQ9sQqBDprGGmAnjELCaPsOa7szy1BDYKsZofb5bwCmtX5JKdemkQB6MTCzNXEGq8wz46+lXBEFCswOlMEUqXmlQZZiqUEX8sxXsYwrFSbZnkJ7vFjFimSVmEzqC8+UOOQEEDDkJGQI46+XFX+IZGOcH3ubmZGRozUmwVZEz2EXmie89ah1CT29e0GklpEgrburL69qMHsprY/HvZumuxuLqh71A72RLIjLa35poftP9EAS3qJBYZiIqBVQwVKO8E/eFnZYQTcyLJ+uf7JhToNTuvgEkQTkGCiPxSTEtZSaXOAdLIw+KLfSLKVUL7kJTMMHuGI=" /> </div> <script type="text/javascript"> //<![CDATA[ var theForm = document.forms['aspnetForm']; if (!theForm) { theForm = document.aspnetForm; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } //]]> </script> <script src="/WebResource.axd?d=7T0TTNRMLWS7341dKzBHTJPEgR2Gsj41UucL69DCprL_hrO-1GW_6Pb4yCwdbDXXDBu4pyG0pV8C5HWdj-C48EVhy0Y1&t=638628207619783110" type="text/javascript"></script> </form> <script src="https://test.c-sharpcorner.com/JQuery/jquery.min-20150912.js"></script> <script src="https://test.c-sharpcorner.com/JQuery/DatepickerUI/jquery-ui.min.js"></script> <script src="https://test.c-sharpcorner.com/JQuery/jquery-Mention-Combined.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/NewCommon_20230624.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/NewLogin_20230624.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/NewPopupPlugin.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/NewEmotions_200181208.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/comments_new_20230624.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/NewAds_20210123.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/video_detail_new_20200719.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/VideoSearch_20200719.js"></script> <script src="https://test.c-sharpcorner.com/jwplayer/jwplayer.js"></script> <script src="https://test.c-sharpcorner.com/jwplayer/jquery.playlist.js"></script> <script type="text/javascript" src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/login-v3.js"></script> <script type="text/javascript" src="https://test.c-sharpcorner.com/JavaScripts/jquery-ui-1.11.1.js"></script> <script src="https://test.c-sharpcorner.com/JavaScripts/NewScripts/videos_watch_history.js"></script> <script> jQuery(document).ready(function () { var title = jQuery('#ContentTitle'); var txt = document.createElement('textarea'); txt.innerHTML = title.text(); jQuery('#ContentTitle').text(txt.value) }); function Search() { if (jQuery('#txtAutoComplete').val() != '') { __doPostBack(BtnSearch, ''); // need to manually submit return true; } else { alert('Please enter search text.'); return false } } fixBrokenImages = function (url) { var img = document.getElementsByTagName('img'); var i = 0, l = img.length; for (; i < l; i++) { var t = img[i]; if (t.naturalWidth === 0) { //this image is broken t.src = url; } } } window.onload = function () { fixBrokenImages('/Images/no-video.png'); } jQuery(document).click(function () { jQuery(".cotent-share-icon > ul").slideUp("fast"); }); jQuery(".btn-icon-dots").click(function (e) { e.stopPropagation(); jQuery(".cotent-share-icon > ul").slideToggle("fast"); }); </script> <script> function getCookie(cookieName) { var name = cookieName + "="; var allCookieArray = document.cookie.split(';'); for (var i = 0; i < allCookieArray.length; i++) { var temp = allCookieArray[i].trim(); if (temp.indexOf(name) == 0) return temp.substring(name.length, temp.length); } return ""; } </script> <script> //if (navigator.serviceWorker.controller) { // console.log('[PWA Builder] active service worker found, no need to register') //} else { // navigator.serviceWorker.register('https://www.c-sharpcorner.com/sw.js', { // scope: './' // }).then(function (reg) { // console.log('Service worker has been registered for scope:' + reg.scope); // }); //} //setTimeout(function () { // makeSticky(); //}, 6000) function makeSticky() { if (!window.jQuery) { setTimeout(makeSticky, 100); return; } var s = jQuery(".sticky-ad"); var w = jQuery(window); var t = s.length > 0 ? s.offset().top : 0; var f = jQuery("footer"); var ft = f.offset().top; if (s.length > 0) { w.scroll(function () { if (w.scrollTop() + 47 > t) { if (w.scrollTop() + 47 + s.innerHeight() > ft + 5) { s.removeClass("fixed-t"); s.addClass("fixed-b"); } else { s.addClass("fixed-t"); s.removeClass("fixed-b"); } } else { s.removeClass("fixed-t") s.removeClass("fixed-b") } }) } } </script> </body> </html>