I have a link in my page that downloads a PDF file however after they have clicked either of the download links, I would like to take them to another page.
The page gives them one of 2 choices for selecting a download file but I only wish to allow them to make one choice and then exit to another page.
My code is as follows:
<div class="columns medium-6">
<h3 class="text-center">7 Tips for Creating a <br />Happy Workplace</h3> <img src="https://www.maylake.com.au/_assets/images/mini-guide/bookcover-7-tips-workplace.png" height="250px" alt="7 Tips for Creating a Happy Workplace eBook">
<p style="font-size: 18px;" class="text-center">Discover how you can make your workplace a healthier environment by simply making being a happy place to work for everyone</p>
<div class="choose">
<input type="radio" name="choice-books" id="choice-7-tips">
<label>I would like to receive a copy of the eBook</label>
<div class="reveal-if-active">
<p class="text-center">DOWNLOAD Now </p>
</div>
</div>
</div>
<div class="columns medium-6">
<h3 class="text-center">Your Short Guide to Leasing a Commercial Office Space</h3> <img src="https://www.maylake.com.au/_assets/images/mini-guide/bookcover-leasing-commercial-office.png" alt="Guide to Leasing Commercial Office" height="250">
<p style="font-size: 18px;" class="text-center">Understand what you should be considering before leasing any commercial office space. Being forewarned and prepared could save you lots
of money and grief</p>
<div class="choose">
<input type="radio" name="choice-books" id="choice-leasing">
<label for="choice-leasing">I would like to receive a copy of the eBook</label>
<div class="reveal-if-active">
<p class="text-center">DOWNLOAD Now </p>
</div>
</div>
</div>
I would change your a elements to something like this:
<a target="_blank" href="/LiteratureRetrieve.aspx?ID=192014" class="button radius text-center" onclick="window.location='http://google.com';">DOWNLOAD Now</a>
This will take them to google.com at the same time they are downloading the pdf.
I'm trying to clone links in order to make a series of images clickable links. I tried using some of the code examples in jQuery - Copy a dynamic link from one element to another. It's not working.
Given the following HTML code:
<ul class="slides">
<li class="views-row views-row-1 views-row-odd views-row-first">
<div>
<img src="https://www.sfmta.com/sites/default/files/styles/home_slide/public/homeslides/2017/Clipper%20on%20Muni-1.png?itok=PPZNHt_N" width="630" height="369" alt="Image with a Clipper Card and illustrated Muni bus with text: Get Clipper and save on Muni." title="Get Clipper and save on Muni" />
</div>
<div class="slider-caption">
<div class="row-fluid">
<div class="span6 offset6">
<div class="slider-caption-inner">
<h2>
New Muni Fare Changes
</h2>
<p>New Muni fares include single-ride savings for using Clipper and MuniMobile.</p>
Learn more
</div>
</div>
</div>
</div>
</li>
... (more list items)
</ul>
I am seeking the following result, with line 4 of the code being the only changed line (surrounding img with a cloned anchor tag):
<ul class="slides">
<li class="views-row views-row-1 views-row-odd views-row-first">
<div>
<img src="https://www.sfmta.com/sites/default/files/styles/home_slide/public/homeslides/2017/Clipper%20on%20Muni-1.png?itok=PPZNHt_N" width="630" height="369" alt="Image with a Clipper Card and illustrated Muni bus with text: Get Clipper and save on Muni." title="Get Clipper and save on Muni" />
</div>
<div class="slider-caption">
<div class="row-fluid">
<div class="span6 offset6">
<div class="slider-caption-inner">
<h2>
New Muni Fare Changes
</h2>
<p>New Muni fares include single-ride savings for using Clipper and MuniMobile.</p>
Learn more
</div>
</div>
</div>
</div>
</li>
...
</ul>
I tried two different code versions based on the linked Stack Overflow post:
Version 1:
jQuery(document).ready(function() {
"use strict";
jQuery('.slides .views-row .img').wrap(function() {
return jQuery(this).closest('.views-row').find('h2 a').clone().text('');
});
});
Version 2:
jQuery(document).ready(function() {
"use strict";
jQuery('.slides .views-row .img').html(function(i,html) {
return $(this).next('h2').find('a').clone().html( html );
});
});
Neither code works. The images in the list do not become linked. The HTML code remains unchanged. (Tested in Firefox and Chrome on Windows.)
There is no JavaScript error on my browser console. There is a warning against jQuery minimized JavaScript itself "Use of getPreventDefault() is deprecated. Use defaultPrevented instead." but that's already been happening and does not prevent already-existing jQuery code on my site from working.
Any ideas/corrections?
Instead try to use a different way.
When you try to click on image, try to trigger a click event on link as both having a same url.
I am displaying courses that I offer and am using Javascript/jQuery to display/hide based on element classes.
The page is here: http://dev.sharepoint-videos.com/sharepoint-2013-training-courses-dev/
Basically the script hides all of the content on the page and then displays items that match the class selector which is comprised of drop down and checkbox options. All is well except I would like to allow the appearance of keeping results static when more than one filter applies. e.g. if they select author and then level and then audience I would like the courses that apply to all 3 selectors to remain while the others are hidden.
HTML here:
function ApplyFilters() {
var effect = 'magictime swap';
var reseteffect = 'magictime twisterInUp';
var courses = jQuery(".courseContainer");
jQuery("p.zeroResults").text("").css("margin-top", "0px");
courses.hide();
courses.removeClass(effect);
courses.removeClass(reseteffect);
var speakerFilter = jQuery("#author_filter").val();
var levelFilter = jQuery("#level_filter").val();
var audienceFilter = jQuery("#audience_filter").val();
var Office365Filter = GetOffice365Value();
var classFilter = speakerFilter + levelFilter + audienceFilter + Office365Filter;
var count = jQuery(classFilter);
if (count.length > 0) {
//jQuery(classFilter).hide().fadeIn(1500);
jQuery(classFilter).hide().addClass(effect).show();
} else {
jQuery("p.zeroResults").text("No Results Match Your Select. Please 'Reset' your filters").css("margin-top", "-50px");
}
}
[two_third]
<h2>SharePoint 2013/Office 365 Courses</h2>
SharePoint 2013/Office 365 brings a fresh new interface and lots of new and improved functionality compared to SharePoint 2010. Watch the video based courses below to explore SharePoint 2013 products and technologies in depth.
<div class="clearfix course"></div>
<div style="border:1px solid #ccc;padding:8px;border-radius:7px;">
<b>Filter Classes By:</b><br />
<div style="display:inline-block;width:145px;">
Author<br />
<select id="author_filter" onchange="ApplyFilters();">
<option value="" selected="">All</option>
<option value=".MarcAnderson">Marc Anderson</option>
<option value=".ChrisBeckett">Chris Beckett</option>
<option value=".GerryBrimacombe">Gerry Brimacombe</option>
<option value=".MelissaEsquibel">Melissa Esquibel</option>
<option value=".SteveFox">Steve Fox</option>
<option value=".IraFuchs">Ira Fuchs</option>
<option value=".SarahHaase">Sarah Haase</option>
<option value=".JasonHimmelstein">Jason Himmelstein</option>
<option value=".JohnHolliday">John Holliday</option>
<option value=".AdamLevithan">Adam Levithan</option>
<option value=".JamieMcAllister">Jamie McAllister</option>
<option value=".ChrisMcNulty">Chris McNulty</option>
<option value=".AgnesMolnar">Agnes Molnar</option>
<option value=".BenjaminNiaulin">Benjamin Niaulin</option>
<option value=".MichaelNoel">Michael Noel</option>
<option value=".YaroslavPentsarskyy">Yaroslav Pentsarskyy</option>
<option value=".AsifRehmani">Asif Rehmani</option>
<option value=".DarvishShadravan">Darvish Shadravan</option>
<option value=".ScottShearer">Scott Shearer</option>
<option value=".DuxRaymondSy">Dux Raymond Sy</option>
<option value=".FabianWilliams">Fabian Williams</option>
</select>
</div>
<div style="display:inline-block;width:100px;margin-left:15px">
Level<br />
<select id="level_filter" onchange="ApplyFilters();">
<option value="" selected="">All</option>
<option value=".Overview">Overview</option>
<option value=".Intermediate">Intermediate</option>
<option value=".Advanced">Advanced</option>
</select>
</div>
<div style="display:inline-block;width:150px;margin-left:10px">
Audience<br />
<select id="audience_filter" onchange="ApplyFilters();">
<option value="" selected="">All</option>
<option value=".Designer">Designer</option>
<option value=".Developer">Developer</option>
<option value=".InformationWorker">Information Worker</option>
<option value=".ITProfessional">IT Professional</option>
<option value=".PowerUser">Power User</option>
<option value=".ProjectManager">Project Manager</option>
</select>
</div>
<div style="display:inline-block;width:70px;margin-left:30px">
Office 365<br /><input type="checkbox" id="365_filter" value="office365" onchange="ApplyFilters();" />
</div>
<div style="display:inline-block;width:50px;margin-left:0px">
<input type="button" id="reset_filter" value="Reset"/>
</div>
</div>
<!--<button class="subscribeToday">Subscribe Today!</button>-->
[/two_third]
[one_third_last]
<div class="subscribeContainer"><p>Subscribe to view our entire collection of <strong>[postcount]</strong> SharePoint Video Tutorials.</p><p><button class="subcribeButton">Subscribe Today</button></p></div>
<div class="allCourses"><button class="authorButton">Upcoming SharePoint 2013 Training Classes</button></div>
</div>
[/one_third_last]</h4>
<div class="clearfix course"></div>
<div id="courseContainer" style="width:100%;">
<p class="zeroResults" style="font-weight:600;"></p>
<!--Row 1 Start-->
<a class="courseLink" href="http://www.sharepoint-videos.com/sharepoint-2013-video-tutorials/"><div class="courseContainer wide AsifRehmani Overview InformationWorker">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2015/02/AsifRehmani_13.png" />
</div>
</div>
<p class="courseTitle red">SP13-131: The Basics – End User Training </p>
<p><strong>Author: Asif Rehmani</strong></p>
<p>These SharePoint 2013 end user video tutorials are specifically targeted to readers, members and site owners of SharePoint 2013. However, if you are a developer or IT administrator who is new to SharePoint, these will be very helpful in understanding the basics. </p>
</div>
</a>
<a class="courseLink green" href="http://sharepoint-videos.com/video-categories/sharepoint-2013-training-courses/sp13-132-sharepoint-2013-end-user-training-2/"><div class="courseContainer wide MelissaEsquibel Overview InformationWorker">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2014/07/MEsquibel2013.jpg" />
</div>
</div>
<p class="courseTitle green">SP13-132: End User Training Part 2 </p>
<p><strong>Author: Melissa Esquibel</strong></p>
<p>Watch additional End User Training videos on SharePoint 2013 Products and Technologies. These SharePoint 2013 End User video tutorials are specifically targeted to readers, members and site owners of SharePoint 2013.</p>
</div>
</a>
<!--Row1 End-->
<a class="courseLink blue" href="http://www.sharepoint-videos.com/sp13-150-sharepoint-2013-general-videos-training-course/"><div class="courseContainer wide AsifRehmani Overview PowerUser">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2015/02/AsifRehmani_13.png" />
</div>
</div>
<p class="courseTitle blue">SP13-150: General Videos </p>
<p><strong>Author: Asif Rehmani</strong></p>
<p>View this series of videos that show a range of general SharePoint 2013 skill areas including customizing team sites, moving documents and document menus, apps, creating a testing environment, and much more.</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-301-sharepoint-2013-branding/"><div class="courseContainer wide YaroslavPentsarskyy Intermediate Designer">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2009/08/ypentsarskyy_2010.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-301: Branding </p>
<p><strong>Author: Yaroslav Pentaraskyy</strong><p>
<p>SharePoint 2013 comes with many customization and branding opportunities. Customize and brand your SharePoint sites to look ‘non-SharePointy’. This set of videos will give you a solid understanding on how you can improve user interface and brand your SharePoint... <!--sites with visual elements you have seen online or have been provided by a professional design team.--> </p>
</div>
</a>
<!--Row2 End -->
<a class="courseLink green" href="http://www.sharepoint-videos.com/sp13-302-sharepoint-2013-project-management-course/"><div class="courseContainer wide DuxRaymondSy Intermediate ProjectManager">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2009/07/Dux-pic.jpg" />
</div>
</div>
<p class="courseTitle red">SP13-302: Project Management </p>
<p><strong>Author: Dux Raymond Sy</strong></p>
<p>In today’s project-centric work environment, the ability to coordinate various projects with distributed teams and make high-level strategic decisions based upon consolidated project progress, risk and resource usage information is critical. Many organizations today waste...<!-- time and money relying on e-mail, spreadsheets and other manual processes when engaged in time sensitive, highly collaborative project activities. Learn how to use SharePoint Project Management features to their full extent.--></p>
</div>
</a>
<!--Row 3 Start-->
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-303-sharepoint-2013-development-course/"><div class="courseContainer wide YaroslavPentsarskyy Advanced Developer">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2009/08/ypentsarskyy_2010.jpg" />
</div>
</div>
<p class="courseTitle green">SP13-303: Development </p>
<p><strong>Author: Yaroslav Pentaraskyy</strong></p>
<p>Learn about development opportunities available in SharePoint 2013. Skills such as customizing typical SharePoint components, building collaboration solutions, SharePoint 2013 apps, custom site templates, and adding custom look and feel to your SharePoint 2013 site. </p>
</div>
</a>
<a class="courseLink blue" href="http://www.sharepoint-videos.com/sp13-304-sharepoint-designer-2013-workflow-course/"><div class="courseContainer wide ChrisBeckett Intermediate PowerUser">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/tn_chris_beckett_125.jpg" />
</div>
</div>
<p class="courseTitle blue">SP13-304: Workflow</p>
<p><strong>Author: Chris Beckett</strong></p>
<p>Learn No-Code Workflow Development in SharePoint 2013. Automation of content management and business processes can free a busy professional from the time consuming aspects of facilitating the flow of work within and between teams, and reduce waste.</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-305-sharepoint-2013-search-course/"><div class="courseContainer wide AgnesMolnar Intermediate ITProfessional">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/tn_AgnesMolnar.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-305: Search Video Training Course </p>
<p><strong>Author: Agnes Molnar</strong></p>
<p>For those who want to learn about the Search capabilities and opportunities available in SharePoint 2013. This course covers such topics as content processing, continuous crawl, working with metadata, working with queries, managed navigation and search administration.</p>
</div>
</a>
<a class="courseLink green" href="http://www.sharepoint-videos.com/sp13-30-sharepoint-2013-javascript-and-jquery-course/"><div class="courseContainer wide MarcAnderson
Advanced PowerUser">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/tn_MarcAnderson.jpeg" />
</div>
</div>
<p class="courseTitle red">SP13-306: JavaScript and jQuery Course </p>
<p><strong>Author: Marc Anderson</strong></p>
<p>Learn about Javascript and jQuery based customization opportunities available in SharePoint 2013. Course covers elements such as jQuery selectors, element attributes, events and effects, Document Object Model (DOM), retrieving data, jQuery UI and much more</p>
</div>
</a>
<!--Copy Start -->
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-307-sharepoint-2013-enterprise-forms-course/"><div class="courseContainer wide DarvishShadravan Intermediate PowerUser">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/dravishPhotoNew.png" />
</div>
</div>
<p class="courseTitle green">SP13-307: Enterprise Forms</p>
<p><strong>Author: Darvish Shadravan</strong></p>
<p>Learn about available options for building digital forms in SharePoint 2013. You will learn an Introduction to SharePoint 2013 Forms concepts, What’s new with InfoPath 2013, How to build form Apps for SharePoint 2013, Access 2013′s no code approach, and much more. </p>
</div>
</a>
<a class="courseLink blue" href="http://www.sharepoint-videos.com/sp13-308-sharepoint-2013-administration-course/"><div class="courseContainer wide MichaelNoel Intermediate ITProfessional">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/Michael-Noel.png" />
</div>
</div>
<p class="courseTitle blue">SP13-308: Administration</p>
<p><strong>Author: Michael Noel</strong></p>
<p>Learn Administration options available in SharePoint 2013. You’ll first get an introduction to SharePoint 2013 Administration, discuss options in Central Administration for you to manage your SharePoint farm, how to utilize PowerShell to administer SharePoint and much more.</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-309-sharepoint-2013-records-management-course/"><div class="courseContainer wide JohnHolliday Advanced ITProfessional">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/tn_John-Holliday.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-309: Records Management </p>
<p><strong>Author: John Holliday</strong></p>
<p>Learn how to develop a file plan for managing records, strategies for ensuring that end users adhere to compliance requirements, options for managing record declaration and retention, how to create and configure a records repository, and much more.</p>
</div>
</a>
<a class="courseLink red" href="http://www.sharepoint-videos.com/sp13-310-sharepoint-2013-business-intelligence-course/"><div class="courseContainer wide JasonHimmelstein Intermediate PowerUser">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/tn_JasonHimmelstein.jpg" />
</div>
</div>
<p class="courseTitle red">SP13-310: Business Intelligence </p>
<p><strong>Author: Jason Himmelstein</strong></p>
<p>Learn what it takes to build Business Intelligence solutions in SharePoint 2013. Loaded with the most current real world information and demonstrations including introduction to SharePoint 2013 Business Intelligence stack, deploying a SharePoint BI center, and much more.</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-311-sharepoint-2013-beginning-development/"><div class="courseContainer wide SteveFox Advanced PowerUser">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/10/steve_fox_photo.png" />
</div>
</div>
<p class="courseTitle green">SP13-311: Beginning Development Course</p>
<p><strong>Author: Steve Fox</strong></p>
<p>This course is for those who are either new to SharePoint development or already know SharePoint but want to upgrade their development skills to SharePoint 2013. Learn about application models, developer tools, Apps, Client-Side Object Model, REST/OData APIs, and more.</p>
</div>
</a>
<a class="courseLink blue" href="http://www.sharepoint-videos.com/sp13-312-sharepoint-2013-project-2013-course/"><div class="courseContainer wide DuxRaymondSy Intermediate ProjectManager">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2009/07/Dux-pic.jpg" />
</div>
</div>
<p class="courseTitle blue">SP13-312: Project 2013 Course</p>
<p><strong>Author: Dux Raymond Sy</strong></p>
<p>Learn about Project Management using Project 2013 and SharePoint 2013. You’ll learn to define project schedule based on a project start or finish date; utilize relevant project calendar; identify tasks and dependencies; enter task estimates based on duration and much more</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-313-sharepoint-2013-managed-metadata-course/"><div class="courseContainer wide ChrisMcNulty Intermediate ProjectManager">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/chris_mcnulty.png" />
</div>
</div>
<p class="courseTitle yellow">SP13-313: Managed Metadata </p>
<p><strong>Author: Chris McNulty</strong></p>
<p>As SharePoint explodes in enterprise capacity, big data often results in a lot of big noise, too. Managed Metadata and Enterprise Content Management provide tools and analysis to help you separate valuable signals from all the useless background static. </p>
</div>
</a>
<a class="courseLink red" href="http://www.sharepoint-videos.com/sp13-314-cheap-thrills-in-sharepoint-course/"><div class="courseContainer wide IraFuchs Intermediate PowerUser">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/Ira-Fuchs-photo-square-01.png" />
</div>
</div>
<p class="courseTitle red">SP13-314: Cheap Thrills in SharePoint </p>
<p><strong>Author: Ira Fuchs</strong></p>
<p>Learn about automation using SharePoint Designer workflows and creation of a great scheduling and resource reservation system using SharePoint Calendars. The presenter will demonstrate some of the truly useful, valuable and easy things you can do with SharePoint that address real-world needs.</p>
</div>
</a>
<a class="courseLink" href="http://www.sharepoint-videos.com/sp13-315-sharepoint-online-office-365-branding-course/"><div class="courseContainer wide YaroslavPentsarskyy Intermediate Designer office365">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2009/08/ypentsarskyy_2010.jpg" />
</div>
</div>
<p class="courseTitle green">SP13-315: SP Online (Office 365) Branding</p>
<p><strong>Author: Yaroslav Pentsarskyy</strong></p>
<p>Learn about SharePoint Online (Office 365) Branding, Site Customization, Management and Responsive Design. Looking at varied SharePoint online sites, customization options using SharePoint Designer and Visual Studio, key branding artifacts and much more. </p>
</div>
</a>
<a class="courseLink green" href="http://www.sharepoint-videos.com/sp13-316-bcs-sharepoint-2013/"><div class="courseContainer wide FabianWilliams Advanced PowerUser">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://www.sharepoint-videos.com/wp-content/uploads/2013/04/fabian_williams.png" />
</div>
</div>
<p class="courseTitle blue">SP13-316: Working with External Data (BCS)</p>
<p><strong>Author: Fabian Williams</strong></p>
<p>Learn about working with External Data through the eyes of SharePoint Server 2013 and SharePoint Online. We will cover the the new Business Connectivity Services (BCS) and the new Workflow Engine. Learn how to manage workflows using No Code SharePoint Designer solutions and Visual Studio with OData and Declarative Workflow Solutions.</p>
</div>
</a>
<a class="courseLink" href="http://sharepoint-videos.com/sp13-317-making-enterprise-social-real-in-your-organization-with-yammer-and-sharepoint/"><div class="courseContainer wide NaomiMoneypenny Intermediate PowerUser">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2014/07/naomi_moneypenny_headshot.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-317: Enterprise Social in Your Organization </p>
<p><strong>Author: Naomi Moneypenny</strong></p>
<p>Let’s go on a deep dive on what it takes to make social collaboration a reality for your company. We’ll talk about business benefits, constructing use cases and key metrics for your network’s maturity. Then we’ll focus on the key roles, tools and resources to be most effective. </p>
</div>
</a>
<a class="courseLink red" href="http://www.sharepoint-videos.com/implementing-sharepoint-2013-hybrid-for-search-business-connectivity-services-onedrive-for-business-and-yammer/"><div class="courseContainer wide FabianWilliams Advanced ITProfessional">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2014/07/fabian_williams.png" />
</div>
</div>
<p class="courseTitle red">SP13-318: Hybrid Environment in SharePoint </p>
<p><strong>Author: Fabian Williams</strong></p>
<p>This course will focus on SharePoint hybrid and on-premise environments. Attendees will learn how to make the hybrid environment work together with SharePoint services.</p>
</div>
</a>
<a class="courseLink" href="http://sharepoint-videos.com/video-categories/sharepoint-2013-training-courses/sp13-319-essential-content-management-in-sharepoint-2013-and-office-365/"><div class="courseContainer wide JamieMcAllister Overview InformationWorker office365">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2015/05/jamiemcallister.jpg" />
</div>
</div>
<p class="courseTitle green">SP13-319: Essential Content Management</p>
<p><strong>Author: Jamie McAllister</strong></p>
<p>Learn about SharePoint content management essentials in SharePoint 2013 and Office 365. Our focus will be to learn how to take best advantage of content management capabilities in both products. We will address SharePoint Lists, Libraries and Document Management with special emphasis on Quality Control of Content and Organizing your documents. </p>
</div>
</a>
<a class="courseLink green" href="http://sharepoint-videos.com/module-1/exploring-new-search-in-sharepoint-2013/"><div class="courseContainer wide BenjaminNiaulin Overview ITProfessional">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="https://media.licdn.com/mpr/mpr/shrinknp_400_400/p/2/005/06e/386/2da6baf.jpg" />
</div>
</div>
<p class="courseTitle blue">SP13-320: SharePoint Search 2013</p>
<p><strong>Author: Benjamin Niaulin</strong></p>
<p>Major changes brought to SharePoint 2013 lie around Search. With the new Continuous Crawl, the new architecture and the many changes to the existing and new Web Parts, your architecture will need to be re-worked. This session is for those with experience in SharePoint 2010 that want to see how we can exploit the new features and Web Parts.</p>
</div>
</a>
<a class="courseLink" href="http://sharepoint-videos.com/module-1/supporting-office-365/"><div class="courseContainer wide AdamLevithan Intermediate ITProfessional office365">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="https://media.licdn.com/mpr/mpr/shrinknp_400_400/AAEAAQAAAAAAAAKHAAAAJDk5NWY4MjZlLWI2ZDUtNDlhNi1hMTg5LWU3MmE2ZjA2YjdjOA.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-321: Office 365 Administration </p>
<p><strong>Author: Adam Levithan</strong></p>
<p>Are you a SharePoint or Exchange Administrator in a large organization, or maybe a do-it-all Network to Software Microsoft stack expert in a small to medium size business? Have you been reading about the transition from Development or Administration to DevOps? </p>
</div>
</a>
<a class="courseLink red" href="http://www.sharepoint-videos.com/module-1/sharepoint-designer-2013-workflows-an-introduction/"><div class="courseContainer wide ScottShearer Overview PowerUser">
<div class="courseHeader CHred">
<div class="courseAuthor">
<img src="https://pbs.twimg.com/profile_images/2447078638/b9wdekijb6uftiwsb71d_400x400.jpeg" />
</div>
</div>
<p class="courseTitle red">SP13-322: SharePoint Designer 2013 Workflows – An Introduction </p>
<p><strong>Author: Scott Shearer</strong></p>
<p>Learn how to create SharePoint Designer workflows from the ground up. This session is full of live demos designed to provide a solid foundation for creating workflows. List workflows, reusable workflows and site workflows will all be discussed and created live. Learn how easy it is to automate processes by using SharePoint Designer workflows.</p>
</div>
</a>
<a class="courseLink" href="http://sharepoint-videos.com/module-1/content-types-love-them-or-lose-it/"><div class="courseContainer wide MarcAnderson Overview PowerUser">
<div class="courseHeader CHgreen">
<div class="courseAuthor">
<img src="http://sharepoint-videos.com/wp-content/uploads/2009/08/marc-anderson-headshot.png" />
</div>
</div>
<p class="courseTitle green">SP13-323: Content Types: Love Them or Lose it!</p>
<p><strong>Author: Marc Anderson</strong></p>
<p>One of the most fundamentally powerful capabilities in SharePoint has been Content Types. Content Types should underlie all good information architectures, along with customized metadata (Site Columns) and managed metadata which embodies the taxonomy for *your* organization to make magic happen.</p>
</div>
</a>
<a class="courseLink blue" href="http://sharepoint-videos.com/module-1/escaping-the-land-of-confusion-how-to-create-effective-business-process-solutions-in-sharepoint/"><div class="courseContainer wide SarahHaase Overview PowerUser">
<div class="courseHeader CHblue">
<div class="courseAuthor">
<img src="http://api.ning.com/files/ugK2q4WSACaJdElxo2Gl25Pmer0PPBk1T2LRdI9dyBmraE6RP4vZK1FU*k83f3-q2YLvF5moCOGjYozMoSWSArLLhX5cx0Zx/1027667601.jpeg?xgip=4%3A454%3A1819%3A1819%3B%3B&width=184&height=184&crop=1%3A1" />
</div>
</div>
<p class="courseTitle blue">SP13-324: Creating Effective Business Process Solutions</p>
<p><strong>Author: Sarah Haase</strong></p>
<p>Are you caught in an infinite loop of overgrown, outdated processes? We’ll explore common process engineering methodologies, outline the “universal truths” that will help you relate to your business users and expose the “forgotten layer of content management” that exists at most organizations.</p>
</div>
</a>
<a class="courseLink" href="http://sharepoint-videos.com/module-1/bricks-and-paint-key-concepts-and-foundational-features-to-quickly-build-great-sharepoint-sites/"><div class="courseContainer wide GerryBrimacombe Overview InformationWorker">
<div class="courseHeader CHyellow">
<div class="courseAuthor">
<img src="http://lightlever.ca/wp-content/uploads/2015/06/Gerry2-280x420.jpg" />
</div>
</div>
<p class="courseTitle yellow">SP13-325: Key Concepts to Quickly Build Great SharePoint Sites </p>
<p><strong>Author: Gerry Brimacombe</strong></p>
<p>If SharePoint is the foundation to great collaboration sites, then lists and libraries are the bricks and mortar. Join Gerry Brimacombe as he builds your knowledge from the ground up. Key SharePoint lists and libraries will be discussed and real world applications demonstrated in this high powered session.</p>
</div>
</a>
</div>
I went with Chris' suggestion and deferred the hide based on non-matching elements.
function ApplyFilters() {
var effect = 'magictime swap';
var reseteffect = 'magictime twisterInUp';
var courses = jQuery(".courseContainer");
jQuery("p.zeroResults").text("").css("margin-top", "0px");
courses.removeClass(effect);
courses.removeClass(reseteffect);
var speakerFilter = jQuery("#author_filter").val();
var levelFilter = jQuery("#level_filter").val();
var audienceFilter = jQuery("#audience_filter").val();
var Office365Filter = GetOffice365Value();
var classFilter = speakerFilter + levelFilter + audienceFilter + Office365Filter;
courses.not(classFilter).hide();
if (classFilter == "") {
courses.hide().addClass(effect).show();
} else {
var count = jQuery(classFilter);
if (count.length > 0) {
jQuery(classFilter).show();
} else {
jQuery("p.zeroResults").text("No Results Match Your Select. Please 'Reset' your filters").css("margin-top", "-50px");
}
}
EDITED: I have created an information display using jquery to show information. I want to have the top div open one page load. My current method is to change the name of the top box, and have it act differently.
I am going to use php to populate the divs from a mysql table using a loop, and will not be able to use my current work around.
Is there a smarter way of doing it?
Here is the current script below in action: http://www.luke-sargeant.com/punchline/faq.html.
<script type="text/javascript"> $(document).ready(function() { $('div.view2').show(); $('div.slide2').click(function() { $(this).next('div.view2').slideToggle('fast'); return false; }); }); </script>
<script type="text/javascript"> $(document).ready(function() { $('div.view').hide(); $('div.slide').click(function() { $(this).next('div.view').slideToggle('fast'); return false; }); }); </script>
</div>
<div class="faqlist">
<div class="slide2" style="cursor: pointer;">Where will we meet?</div>
<div class="view2">In Bristol, we always meet In front In front of the Sainsburys/Subway On Broadquay<br /><br />
In Cardiff, the pick up point is at the front of the National Museum.
</div>
<br />
<div class="slide" style="cursor: pointer;">How can I book the trips?</div>
<div class="view">You can book online using PAYPAL or speak with the activities coordinator of your school. They can help you to book a trip or get in touch </div>
<br />
<div class="slide" style="cursor: pointer;">How do I find out information about trips? </div>
<div class="view"> Head to the trips page click the trip you want, and the information will be available. feel free to get in touch if you have any questions. </div>
<br />
<div class="slide" style="cursor: pointer;">What should I bring with me?</div>
<div class="view">Bring yourself along with the email address you booked the trip with. Be sure to bring a camera and your best smile. Warm clothing for cold days and light clothing for hot ones. Money for food, souvenirs and any extra attractions you may be interested in.</div>
<br />
<div class="slide" style="cursor: pointer;">What happens if I miss a trip? </div>
<div class="view">you must let us know 24 hours in advance to cancel a daytrip and 7 days before a weekend trip to consider a refund. sometimes we can find someone to take your place, if we can, your money will be refunded to you. If you cannot find the meeting point on the day of departure, or are going to be late contact us. if you provide a mobile telephone number when booking, we will call you if you are late and wait a reasonable time for you to arrive. </div>
</div><!-- #tab1 -->
</div> <!-- .tab_container -->
</div> <!-- #container -->
</div>
</div>
I like Bootstrap JS Collapse better. I tried your code in JSFiddle and it threw errors in the JS portion.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h2>Where will we meet?</h2>
<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">Simple collapsible</button>
<div id="demo" class="collapse in">
In Bristol, we always meet In front In front of the Sainsburys/Subway On Broadquay<br /><br />In Cardiff, the pick up point is at the front of the National Museum.
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
http://jsfiddle.net/p6dxrake/
I am trying to use jQuery accordion widget. I want to use a common javascript code inside all the accordion section. For e.g I am trying to make a tab view inside every accordion section. The tab view is handled through an external javascript file created by me. Also I am using images slideshow inside every section of the accordion.It works for the a single section only. Whenever i try to paste the same html code in the next section of the accordion , javascript does not execute. The accordion still works. Waiting for your suggestions.
This is the html code
<div id="contentList"><h3 class="accHead" onclick="initAll('FoodCheck')">Food Check</h3>
<div class="accContent">
<ul class="menuHoriz">
<li>What ? </li>
<li>How ? </li>
<li>Who ? </li>
<li>Screenshots </li>
</ul>
<div id="what" class="content">
<p>
Details about the projects<br /> What. description
</p>
</div>
<div id="how" class="content">
<p>
Details about the projects<br /> How description
</p>
</div>
<div id="who" class="content">
<p>
Details about the projects<br /> Who description
</p>
</div>
<div id="screenshots" class="content">
<p>
<h2>FoodCheck Snapshots</h2>
<img height="468" width="250" src="images/FoodCheck/Screen_1.png" alt="First screen" id="slideshow" />
<div id="imgText"> </div>
<br clear="all" />
<form action="#">
<input type="button" id="prevLink" value="« Previous" />
<input type ="button" id="startAgain" value="Start Again">
<input type="button" id="nextLink" value="Next »" />
</form>
</p>
</div>
</div>
This is one of the section of accordion.
There are 3 more such sections. Each section has a Tabs (with id What, who, how, screenshots) in it which are controlled by an external javascript
In
<script type="text/javascript">
$(function() {
//set up the news accordion on the lower page
$("#contentList").accordion({ header: "h3", collapsible: true});
});
</script>
You will have to subscribe to element events and not use some global javascript functionality. Every acordion view can have various controls but they would need to be distinguished by either class or id attributes to attach to their events.
Some code would help of course. Can you provide some? but only relevant parts so ot won't be overwhelming.