CODEWITHSUNDEEP
jquerycssjquery-mobilesmartbanner
Sheeraz
Sheeraz

Reputation: 97

Smart App Banner not working with jQuery Mobile

We are using this code :

    <meta name="apple-itunes-app" content="app-id=1234"/>
    <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="jquery.mobile-1.2.0.min.js"></script>
    <meta name="google-play-app" content="app-id=abc.mobileapp">
    <link rel="stylesheet" href="css/jquery.smartbanner.css" type="text/css" media="screen">

    <script src="jquery.smartbanner.js"></script>
    <script type="text/javascript">
        var jQuery_1_3_2 = $.noConflict(true);
    </script>
    <script type="text/javascript">
      jQuery_1_3_2(function() { jQuery_1_3_2.smartbanner() } )
    </script>

however it does not work and we are not able to see banner on mobile site.

So we have made changes like this and able to see banner on top however css of jquery buttons on our site broke up and all design looks bad.

    <meta name="apple-itunes-app" content="app-id=1234"/>
    <script type="text/javascript" src="jquery.mobile-1.2.0.min.js"></script>
    <meta name="google-play-app" content="app-id=abc.mobileapp">
    <link rel="stylesheet" href="css/jquery.smartbanner.css" type="text/css" media="screen">
    <script type="text/javascript" src="jquery-1.8.3.min.js"></script>

    <script src="jquery.smartbanner.js"></script>
    <script type="text/javascript">
        var jQuery_1_3_2 = $.noConflict(true);
    </script>
    <script type="text/javascript">
      jQuery_1_3_2(function() { jQuery_1_3_2.smartbanner() } )
    </script>

What is the best solution so we can use app banner on our mobile site and design of our mobile site using jquery mobile will not break up.

Thanks in advance.

Upvotes: 2

Views: 898

Answers (1)

Muhammad Omar ElShourbagy
Muhammad Omar ElShourbagy

Reputation: 7068

By far, this one i found best to work with. easy, neat and configurable.

https://github.com/ain/smartbanner.js

You just add your <meta> tags like:

<meta name="smartbanner:title" content="Smart Application">
<meta name="smartbanner:author" content="SmartBanner Contributors">

then add your references to JS and CSS files

<link rel="stylesheet" href="path/to/component/dist/smartbanner.min.css">
<script src="path/to/component/dist/smartbanner.min.js"></script>

Upvotes: 1

Related Questions