Tuesday, July 17, 2012
Adding Bullets in left navigation Sharepoint 2010
$(function(){
$('').insertBefore('.s4-ql ul.root > li > .menu-item .additional-background .menu-item-text')
$('#s4-statusbarcontainer').css("display","none");
$("#layoutsTable").removeAttr("style");
$('.s4-ql ul.root > li > .menu-item .additional-background ').removeClass();
$('').insertBefore('.s4-ql ul.root > li li> .menu-item .additional-background .menu-item-text')
$('.s4-ql ul.root > li li> .menu-item .additional-background').removeClass();
});
jquery Accordian in sharepoint 2010 using Default left navigation
Solution:
Here we go...........
jQuery(document).ready(function ($) {
//Mark as hidden
$('.s4-ql ul.root > li > a.menu-item').attr('data-hide', '1');
$('.s4-ql ul.root > li > span.menu-item').attr('data-hide', '1');
//Hide the children
$('.s4-ql ul.root ul').hide();
var url = window.location.toString().toLowerCase();
$('.s4-ql ul.root > li > a.menu-item, .s4-ql ul.root > li > span.menu-item').each(function (index) {
var $this = $(this);
var thisURL = $this.attr('href');
if(thisURL)
thisURL = thisURL.toLowerCase();
var menuExpanded = 0;
if (url.indexOf(thisURL) != -1) {
showChildren($this);
menuExpanded = 1;
}
if (menuExpanded == 0) {
$this.next().find('li > a').each(function (j) {
var childURL = $(this).attr('href');
if(childURL)
childURL = childURL.toLowerCase();
if (url.indexOf(childURL) != -1) {
showChildren($this);
menuExpanded = 1;
}
});
}
});
function showChildren($this) {
$this.next().show();
$this.attr('data-hide', '0');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
//Show/Hide when the heading is clicked.
$('.s4-ql ul.root > li > span.menu-item').bind('click', function (e) {
var $this = $(this);
toggleChildrenElems($this);
e.preventDefault();
});
function toggleChildrenElems($this) {
if ($this.attr('data-hide') == '1') {
$this.next().show("slow");
$this.attr('data-hide', '0');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
else {
$this.next().hide("slow");
$this.attr('data-hide', '1');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
}
//Disable the webpart header link
$('.ms-WPHeaderTd .ms-standardheader a').bind('click', function (e) {
e.preventDefault();
});
if ($.browser.msie) {
var version = parseInt($.browser.version);
if (version == 7) {
$('ul#custom-top-nav > li.first_level').bind('mouseover', function (e) {
var $this = $(this);
var width = $this.width() + 5;
var marginStyle = 'margin-left: -' + width + 'px;';
var $thisDiv = $(this).find("div#top-nav-children");
$thisDiv.attr("style", marginStyle);
});
}
}
});
Here we go...........
jQuery(document).ready(function ($) {
//Mark as hidden
$('.s4-ql ul.root > li > a.menu-item').attr('data-hide', '1');
$('.s4-ql ul.root > li > span.menu-item').attr('data-hide', '1');
//Hide the children
$('.s4-ql ul.root ul').hide();
var url = window.location.toString().toLowerCase();
$('.s4-ql ul.root > li > a.menu-item, .s4-ql ul.root > li > span.menu-item').each(function (index) {
var $this = $(this);
var thisURL = $this.attr('href');
if(thisURL)
thisURL = thisURL.toLowerCase();
var menuExpanded = 0;
if (url.indexOf(thisURL) != -1) {
showChildren($this);
menuExpanded = 1;
}
if (menuExpanded == 0) {
$this.next().find('li > a').each(function (j) {
var childURL = $(this).attr('href');
if(childURL)
childURL = childURL.toLowerCase();
if (url.indexOf(childURL) != -1) {
showChildren($this);
menuExpanded = 1;
}
});
}
});
function showChildren($this) {
$this.next().show();
$this.attr('data-hide', '0');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
//Show/Hide when the heading is clicked.
$('.s4-ql ul.root > li > span.menu-item').bind('click', function (e) {
var $this = $(this);
toggleChildrenElems($this);
e.preventDefault();
});
function toggleChildrenElems($this) {
if ($this.attr('data-hide') == '1') {
$this.next().show("slow");
$this.attr('data-hide', '0');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
else {
$this.next().hide("slow");
$this.attr('data-hide', '1');
$this.attr('style', "background:url('/Style Library/Images/image/ul-li.png') repeat;");
}
}
//Disable the webpart header link
$('.ms-WPHeaderTd .ms-standardheader a').bind('click', function (e) {
e.preventDefault();
});
if ($.browser.msie) {
var version = parseInt($.browser.version);
if (version == 7) {
$('ul#custom-top-nav > li.first_level').bind('mouseover', function (e) {
var $this = $(this);
var width = $this.width() + 5;
var marginStyle = 'margin-left: -' + width + 'px;';
var $thisDiv = $(this).find("div#top-nav-children");
$thisDiv.attr("style", marginStyle);
});
}
}
});
CSS3 - PIE.htc and SharePoint 2010
Solution
Step1:
Open the Folder location
C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\projectName
Step2:
Paste border-radius.htc
Step3:
Add url in css in my case i used
.middlePic img
{
width:99%;
height:286px;
border-radius:20px;
border:2px solid #bebebe;
-webkit-transition: all 0.9s ease-in-out;
-moz-transition: all 0.9s ease-in-out;
-o-transition: all 0.9s ease-in-out;
transition: all 0.9s ease-in-out;
-ms-transition:all 0.9s ease-in-out;
behavior: url(/_LAYOUTS/project/border-radius.htc);
}
Step4:
Congrates..
Step1:
Open the Folder location
C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\projectName
Step2:
Paste border-radius.htc
Step3:
Add url in css in my case i used
.middlePic img
{
width:99%;
height:286px;
border-radius:20px;
border:2px solid #bebebe;
-webkit-transition: all 0.9s ease-in-out;
-moz-transition: all 0.9s ease-in-out;
-o-transition: all 0.9s ease-in-out;
transition: all 0.9s ease-in-out;
-ms-transition:all 0.9s ease-in-out;
behavior: url(/_LAYOUTS/project/border-radius.htc);
}
Step4:
Congrates..
Subscribe to:
Posts (Atom)