+1-888-365-2779
Try Now
More in this section

Forums / Project Feather / How to Get Foundation and Other Scripts to Read

How to Get Foundation and Other Scripts to Read

3 posts, 0 answered
  1. Maria
    Maria avatar
    4 posts
    Registered:
    04 Apr 2011
    06 Feb
    Link to this post

    Hi everyone,

    I am trying to transfer an HTML/CSS/JS prototype into Sitefinity. The theme is setup with the CSS reading in correctly. The page template is also reading correctly via the .master page I created. However, some functionality is not reading correctly.

    I have attached a file that shows what is not working. This includes: a megamenu clicking functionality, off-canvas menu clicking functionality, and accordian clicking functionality--all the clicking! :) All of this is built under the Zurb Foundation base.

    Other notes:

    - Sitefinity Feather is installed, and Foundation is there; but I am using a custom .master page that is Foundation-based. I am not using the Foundation grid in page templates via Sitefinity Admin.

    - I have a no-conflict script going, as described by Sitefinity. I'm not confident I am using it correctly, but it looks to be following those instructions. I use this no-conflict on our current live site okay. It's not working in this new site development I'm building though.

    This is the only thing in the way of my continuing development. Any help would be greatly appreciated. I should also note that I am not a .NET guru, so assistance with terminology is also appreciated if it gets to be a complex fix in this language. 

    Thank you in advance for your time and help.

    Maria

  2. Maria
    Maria avatar
    4 posts
    Registered:
    04 Apr 2011
    08 Feb
    Link to this post

    Hi everyone,

    I have reviewed other posts related to this topic in the forums, but I feel like there are mixed approaches. Below is my current code for implementing scripts. Is this going in the right direction? I still can't get the scripts to read though...

    <%@ Master Language="C#" AutoEventWireup="true" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.PublicControls" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
     
    <!doctype html>
    <html class="no-js" lang="en">
    <head id="Head" runat="server">
     
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta charset="utf-8">
        <title>Inside Page</title>
     
        <link rel="stylesheet" href="~/Sitefinity/WebsiteTemplates/SchoolcraftCollege/App_Themes/SCTheme/Global/stylesheet.css">
        <link href="https://fonts.googleapis.com/css?family=Jaldi:400,700&subset=latin-ext" rel="stylesheet" />
        <script type="text/javascript">sc = jQuery.noConflict(true);</script>
     
    </head
    <body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
     
        <sf:JavaScriptEmbedControl
            runat="server"
            ID="jQueryLink"
            ScriptEmbedPosition="Head"
            Url="Sitefinity/WebsiteTemplates/SchoolcraftCollege/App_Themes/SCTheme/Global/js/sc.js">
        </sf:JavaScriptEmbedControl>
  3. Maria
    Maria avatar
    4 posts
    Registered:
    04 Apr 2011
    09 Feb
    Link to this post

    Another update:

    I have stripped down my code to get the super basic to work. I have an inline JavaScript that represents the problem I have been having in my original post.

    Inline, I can get this script to work, my code below:

    <%@ Master Language="C#" AutoEventWireup="true" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.PublicControls" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
     
    <!doctype html>
    <html class="no-js" lang="en">
    <head id="Head" runat="server">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta charset="utf-8">
        <title>Inside Page</title>
    </head
    <body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
     
        <button onclick="myFunction()">Try it</button>
        <p id="demo"></p>
     
        <script>
            function myFunction() {
                document.getElementById("demo").innerHTML = "This Works!";
            }
        </script>
     
    </form>
    </body>
    </html>

     

    But - it works and then disappears in a second. The script doesn't stick. 

    But - if I change the <button> to be a <div> instead, it works.

    What is going on with the <button> tag? I don't understand.

     

     

3 posts, 0 answered