JQtouch image linking
I'm trying to enable functionality in my web app to allow users to click on the company's logo to link back to the main page of the web app using JQtouch. With my current code, I'm getting the an error in the web inspector saying that there are "No pages in the history" when I click on the image.
Here is an example:
<a href="#mainScreen"><img src="images/logo.gif"></a>
Basically, I want to use this image as a link, have the animation transition work properly and have the flexibility of using # notation to reference different screens of my html file.
current code:
<html>
<head>
<title>main</title>
<link type="text/css" rel="stylesheet" media="screen" href="jqtouch/jqtouch.css">
<link type ="text/css" rel="stylesheet" media="screen" href="themes/jqt/theme.css">
<script type="text/javascript" src="jqtouch/jquery.js"></script>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="jqtouch/jqtouch.js"></script>
<script type="text/javascript">
var jQT = $.jQTouch({
statusBar: 'black'
});
</script>
</head>
<body id="stackLayout">
<div id="mainScreen">
<div class="toolbar">
<a class="button flip" href="#friends" style="margin-right: 250px">Friends&l开发者_如何学Pythont;/a>
<a class="button flip" href="#nearby" style="margin-right: 193px">Nearby</a>
<a class="button flip" href="#me" style="margin-right: 160px">Me</a>
<a class="button flip" href="#settings" style="margin-right: 80px">Settings</a>
<img style="float: right; margin-right: -14px; margin-top: -10px" src="images/logo.jpg" onclick="logo_onClickHandler(event)">
</div>
</div>
<form method="post" style="margin: 150px 0 0 0">
<ul>
<li><input placeholder="When" type="text" name="when" id="whenField" /></li>
<li><input placeholder="Where" type="text" name="where"
id="whereField" /></li>
<li><input placeholder="" type="text" name="weight"
id="weight" /></li>
<li><input type="submit" class="submit" name="action"
value="Post" /></li>
</ul>
</form>
</div>
Here is my JS:
$(document).ready(function(){
});
function logo_onClickHandler(event) {
var views = document.getElementById('stackLayout')
var main = document.getElementById('mainScreen');
if (views && views.object && main){
views.object.setCurrentView(main, true);
}
}
This is a bug in using the jQTouch on the main site (or from the downloads in google code). The issue is reported here: http://code.google.com/p/jqtouch/issues/detail?id=103.
To fix this issue, use the newest in svn or any jqtouch r113 on higher. (The one in svn is r148 currently and the one from main site is r109.)
Link to svn is here:Google Code for jQTouch
加载中,请稍侯......
精彩评论