|
PHP - Autocomplete Arrow Key Scroll
I have a working autocomplete which connects to my database using ajax. I am trying to include a function where the user can scroll through the results list using the up/down arrow keys. All of the suggestions I found in google basically broke my autocomplete and yes I've installed the latest Jquery.
Also, for some reason the user has to click the upper half of the search result in order for the data to display otherwise it won't register for some reason any ideas about that?
Any help would be greatly appreciated. Thanks
<script type="text/javascript">
$(function(){
$(".search").keyup(function()
{
var searchid = $(this).val();
var dataString = 'search='+ searchid;
if(searchid!='')
{
$.ajax({
type: "POST",
url: "search.php",
data: dataString,
cache: false,
success: function(html)
{
$("#result").html(html).show();
}
});
}return false;
});
jQuery("#result").live("click",function(e){
var $clicked = $(e.target);
var $name = $clicked.find('.name').html();
var decoded = $("<div/>").html($name).text();
$('#searchid').val(decoded);
var yourLinkHref= $(this).attr('href');
window.location = "mainpage.php?TopicName=" + $name;
});
jQuery(document).live("click", function(e) {
var $clicked = $(e.target);
if (! $clicked.hasClass("search")){
jQuery("#result").fadeOut();
}
});
$('#searchid').click(function(){
jQuery("#result").fadeIn();
});
});
</script>
Similar Tutorialshey guys im trying to get an autocomplete script working at the moment...although im pretty new to jquery...ive added jquery.js and jquery-ui.js (I think I need both?)
here is my code if anyone can give me some pointers please...thank you
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="media/scripts/library/jquery.js"></script>
<script src="media/scripts/library/jquery-ui.js"></script>
<script>
$(document).ready(function()
{
function autocomplete(selecor, tags)
{
$( '#' . + selector).autocomplete(
{
source: tags
});
}
var availableTags = [ "ActionScript",
"AppleScript",
"Asp"];
autocomplete('query', availableTags);
});
</script>
<title></title>
</head>
<body>
Search: <input type="text" name="q" id="query" />
</body>
</html>
I was looking over some php code, and came across this: $c=($c*$j)<<2; I have never see << before, what does it mean/do? I read this article. About two thirds down it mentions that you can turn off autocomplete on the entire form if you put it in the form tag. The post is from 2011 though so I was wondering if it is still valid? Does anyone know if this is still correct? So, can I use something like; <form action="example.php" autocomplete="off"> First name:<input type="text" name="fname"> Last name: <input type="text" name="lname"> E-mail: <input type="email" name="email"> <input type="submit"> </form>Or do I need something like; <form action="example.php"> First name:<input type="text" name="fname" autocomplete="off"> Last name: <input type="text" name="lname" autocomplete="off"> E-mail: <input type="email" name="email" autocomplete="off"> <input type="submit"> </form>To be sure... hi, here is my AutoComplete: http://www.mypubspace.com/phpsite/autoComplete/ At the moment it searched through rsPubName (Pub Names) and outputs Pub Name and rsTown(Town) aswell I would like for the user to type a town and it show all pubs in that town?! here is the PHP code <?php // PHP5 Implementation - uses MySQLi. // mysqli('localhost', 'yourUsername', 'yourPassword', 'yourDatabase'); $db = new mysqli('***', '***' ,'***', '***'); if(!$db) { // Show error if we cannot connect. echo 'ERROR: Could not connect to the database.'; } else { // Is there a posted query string? if(isset($_POST['queryString'])) { $queryString = $db->real_escape_string($_POST['queryString']); // Is the string length greater than 0? if(strlen($queryString) >0) { // Run the query: We use LIKE '$queryString%' // The percentage sign is a wild-card, in my example of countries it works like this... // $queryString = 'Uni'; // Returned data = 'United States, United Kindom'; // YOU NEED TO ALTER THE QUERY TO MATCH YOUR DATABASE. // eg: SELECT yourColumnName FROM yourTable WHERE yourColumnName LIKE '$queryString%' LIMIT 10 $query = $db->query("SELECT * FROM pubs WHERE rsPubName LIKE '$queryString%' LIMIT 10"); if($query) { // While there are results loop through them - fetching an Object (i like PHP5 btw!). while ($result = $query ->fetch_object()) { // Format the results, im using <li> for the list, you can change it. // The onClick function fills the textbox with the result. // YOU MUST CHANGE: $result->value to $result->your_colum echo '<li onClick="fill(\''.$result->rsPubName.', '.$result->rsTown.'\');">'.$result->rsPubName.', '.$result->rsTown.'</li>'; } } else { echo 'ERROR: There was a problem with the query.'; } } else { // Dont do anything. } // There is a queryString. } else { echo 'There should be no direct access to this script!'; } } ?> and the Javascript Code: [Select] <script type="text/javascript"> function lookup(inputString) { if(inputString.length == 0) { // Hide the suggestion box. $('#suggestions').hide(); } else { $.post("rpc.php", {queryString: ""+inputString+""}, function(data){ if(data.length >0) { $('#suggestions').show(); $('#autoSuggestionsList').html(data); } }); } } // lookup function fill(thisValue) { $('#inputString').val(thisValue); setTimeout("$('#suggestions').hide();", 200); } </script> Hey guys im having 2 minor problems with my script if someone can give me some advise please?
(all 2 problems are commented on the script itself)
1. highlighting string characters when typed.
2. also im trying to add "Hide Suggestions" at the bottom of my menu so people can turn on/off autocomplete
$(document).ready(function()
{
function search_autocomplete(selector, tags, default_value)
{
$('#' + selector).focus(function()
{
if($('#' + selector).val() == default_value)
{
$('#' + selector).val('');
}
});
$('#' + selector).blur(function()
{
if($('#' + selector).val() == '')
{
$('#' + selector).val(default_value);
}
});
$('#' + selector).autocomplete(
{
source: tags,
timeout: 0,
select: function (a, b)
{
$(this).val(b.item.value);
//submit
},
create: function ()
{
$(this).data('ui-autocomplete')._renderItem = function (ul, item)
{
// not highlighting when string characters match
var re = new RegExp('^' + this.term);
var t = item.label.replace(re, "<span id='dropdown-item-highlight'>" + "$&" + "</span>");
return $('<li></li>')
.append('<a>' + t + ' in ' + item.type + '</a>')
.addClass( 'dropdown-item' )
.appendTo(ul);
};
}
});
$(this).data('ui-autocomplete')._renderMenu = function (ul, item)
{
// unable to show "Hide Suggestions at the bottom of the autocomplete menu
return $('<ul></ul>')
.append('<a>Hide Suggestions</a>')
.addClass( 'dropdown-menu' );
};
}
var availableTags = [{"label" : "XBOX 360", "type":"Electronics"},
{"label":"XBOX One", "type":"Electronics"},
{"label":"Nike", "type":"Clothing & Footwear"}];
search_autocomplete('query', availableTags, 'Search...');
});
thanks
I'm playing with this tokenizing autocomplete script but am having a strange issue with it. It all seems to work ok and it's pulling the values over from the php file that's doing the db query ok and if you put in a value that doesn't match it will tell you so, however if you do type in a value that matches it simply disappears. This script is exactly like the demo script except for the paths to the js, css, and php files, and I did remove the 1st example but was having this issue before removing it. No changes made to the js file, php file is identical to the demo just with my own db info and table info put in, and no changes to the css file compared to the demo. I've tried this both with jquery 1.3.0 and 1.4.2 and have the same issue with both. Here is the link to my test page: http://www.erecoverydev.com/autocomplete2/autocomplete.html Here is my js file: http://www.erecoverydev.com/autocomplete2/jquery.tokeninput.js Here is my php code: Code: [Select] <? mysql_pconnect("localhost", "myuser", "mypass") or die("Could not connect"); mysql_select_db("mydb") or die("Could not select database"); $query = sprintf("SELECT cb_activities from jos_comprofiler WHERE cb_activities LIKE '%%%s%%' ORDER BY cb_activities DESC LIMIT 10", mysql_real_escape_string($_GET["q"])); $arr = array(); $rs = mysql_query($query); while($obj = mysql_fetch_object($rs)) { $arr[] = $obj; } echo json_encode($arr); ?> A couple of values that are in my table are web development and kicking cats if you want to test it. Here is the link to the demo: http://loopj.com/tokeninput/demo.html It just doesn't make any sense to me why the demo works and mine doesn't when they are basically identical. Hello, I am trying to implement some code I found and downloaded he http://www.roscripts.com/Ajax_autosuggest_autocomplete_from_database-154.html When I try and run this I get no search results back when searching? I have entered data in the database and all connections seem good. Several people in the comments say they have problems, but no solution. Any one that can find the fault here? - THANKS <?php require_once('db.php'); include('classes/stem.php'); include('classes/cleaner.php'); if( !empty ( $_POST['search'] ) ): $string = $_POST['search']; $main_url = 'http://www.roscripts.com/'; $stemmer = new Stemmer; $stemmed_string = $stemmer->stem ( $string ); $clean_string = new jSearchString(); $stemmed_string = $clean_string->parseString ( $stemmed_string ); $new_string = ''; foreach ( array_unique ( split ( " ",$stemmed_string ) ) as $array => $value ) { if(strlen($value) >= 3) { $new_string .= ''.$value.' '; } } $new_string = substr ( $new_string,0, ( strLen ( $new_string ) -1 ) ); if ( strlen ( $new_string ) > 3 ): $split_stemmed = split ( " ",$new_string ); mysql_select_db($database); $sql = "SELECT DISTINCT COUNT(*) as occurences, title, subtitle FROM articles WHERE ("; while ( list ( $key,$val ) = each ( $split_stemmed ) ) { if( $val!='' && strlen ( $val ) > 0 ) { $sql .= "((title LIKE '%".$val."%' OR subtitle LIKE '%".$val."%' OR content LIKE '%".$val."%')) OR"; } } $sql=substr ( $sql,0, ( strLen ( $sql )-3 ) );//this will eat the last OR $sql .= ") GROUP BY title ORDER BY occurences DESC LIMIT 10"; $query = mysql_query($sql) or die ( mysql_error () ); $row_sql = mysql_fetch_assoc ( $query ); $total = mysql_num_rows ( $query ); if($total>0): echo ' <div class="entry">'."\n"; echo ' <ul>'."\n"; while ( $row = mysql_fetch_assoc ( $query ) ) { echo ' <li>'."\n"; echo ' <a href="'.$main_url.'articles/show/'.$row['id'].'">'.$row['title'].''."\n"; echo ' <em>'.$row['subtitle'].'</em>'."\n"; echo ' <span>Added on 2007-06-03 by roScripts</span></a>'."\n"; echo ' </li>'."\n"; } echo ' </ul>'."\n"; echo ' </div>'."\n"; endif; endif; endif; ?> The code can be found in attached zip file. First, Happy X-Mas to all! I want to do a form for entering dog-show results. On first site of form the user is able to enter how many dogs for each class (there are youth and open class for example) he want to insert. So on second site there will be formfields for every dog in every class, created with php. User should be able to take dogname from jquery autocomplete - this works for multiple fields. But i need the according id to the dogname - and actual only one id is given - the first one is changing by choosing from autocomplete in next fields... Data came from a json array like
0: {dogidindatabase: "9892", value: "Excalibur Khali des Gardiens de la Cour ",…}
dogidindatabase: "9892"
label: "<img src='../main/img/female.png' height='20'>Excalibur Khali des Gardiens de la Cour "
value: "Excalibur Khali des Gardiens de la Cour "
1: {dogidindatabase: "15942", value: "Excalibur from Bandit's World Kalli",…}
dogidindatabase: "15942"
label: "<img src='../main/img/male.png' height='20'>Excalibur from Bandit's World Kalli"
value: "Excalibur from Bandit's World Kalli"
all i need is inside ...the script in form is
<script type='text/javascript'>
//<![CDATA[
$(function() {
$(".dog").autocomplete({
source: "xxx.php",
minLength: 3,
select: function(event, ui) {
$('#dogidindatabase').val(ui.item.dogidindatabase);
}
});
$["ui"]["autocomplete"].prototype["_renderItem"] = function( ul, item) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( $( "<a></a>" ).html( item.label ) )
.appendTo( ul );
};
});
//]]>
</script>
and the form looked like
<input type='text' name='dog' class='dog' value='".strip_tags(${'dogname' .($countbabymale+1)})."' size='35' data-required='true' /><br>
<input class='readonly' readonly='readonly' type='text' id='dogidindatabase' name='dogidindatabase' size='5' />
I changed in script and form id='dogidindatabase' to class, but it doesn´t work.
Testsite is under http://www.wolfdog-d...how.php?lang=de (only german at first) - Insert a number (higher than 1) under baby 3-6 (first box, the others are not working for testing); submit to get to page 2; you see all post-variables (for testing).
Try to insert a dogname in first input-field (choose "exc") and insert first one - the id is under dogname. In second dogname inputfield you can choose second dog - the id for the first one changes to id of seond one ....
How can i get both for every dog?
Hi everybody. I'm pretty new in PHP programmation and really new on this forum. So, I'll try to explain my situation the best I can. I have created a modification page where the user can modify certain data of the database. To avoid spelling mistakes, I have created a scroll down menu that includes all the options they have. My problem is that I what the "actual Selection" of the database to be the "selected" option right from the start. Now, my scroll0-down menu shows the first option of my list and not the actual value contained in the database. Here is my partial code: <td><select name="equipe" value="<?php echo($result->equipe) ;?>"> <option <?php if (($result->equipe) == 'Colorado') echo "selected" ?>value='Colorado'>Colorado</option> <option <?php if (($result->equipe) == 'St-Louis') echo "selected" ?>value='St-Louis'>St-Louis</option> <option <?php if (($result->equipe) == 'Montreal') echo "selected" ?>value='Montreal'>Colorado</option> <option <?php if (($result->equipe) == 'Washington') echo "selected" ?>value='Washington'>Washington</option> <option <?php if (($result->equipe) == 'Islanders') echo "selected" ?>value='Islanders'>Islanders</option> <option <?php if (($result->equipe) == 'Edmonton') echo "selected" ?>value='Edmonton'>Edmonton</option> <option <?php if (($result->equipe) == 'Floride') echo "selected" ?>value='Floride'>Floride</option> <option <?php if (($result->equipe) == 'Pittsburgh') echo "selected" ?>value='Pittsburgh'>Pittsburgh</option> <option <?php if (($result->equipe) == 'Anaheim') echo "selected" ?>value='Anaheim'>Anaheim</option> </select> Hi all, Not sure if this is a browser feature kind of thing, or if it can be done with a script. I'm looking at my page: www.mysite.com/index.php?start=0 I scroll to the bottom of the page with the vertical scroll bar, and then click the pagation link to start on page 2, record #50: www.mysite.com/index.php?start=50 Of course, the vertical scroll bar jumps back to the it jumps to the top of my page. Is there a way to make it remember that the scroll bar was at the bottom (or in the middle)? Thanks. I have a function that reads all the picture files in a folder and displays them as thumbnails. It also displays a large version of the first image in the folder and clicking the thumbnail changes the large picture. I'm trying to use pictures of arrows as a button to allow users to click and have the next picture displayed large rather than having to click each individual thumbnail but don't really know how to get started. Can anyone suggest a method or give me a hint? This is my code so far if that helps: function displayPhotos(){ global $columns,$dir,$album; generateThumbnails(); $act = 0; $keyid = 0; $thumb_selected = (isset($_GET['thumb']) ? $_GET['thumb']:''); if ($thumb_selected !==""){ $dirName = substr($thumb_selected,0,strpos($thumb_selected,basename($thumb_selected))); $thumbName = basename($thumb_selected); $thumbFile = $dirName.$thumbName; $large = str_replace('_th.jpg','.jpg',$thumbFile); } else{ $picture_array = glob("$dir*"); $large = $picture_array[$keyid]; } echo "<tr><td colspan='3' height='300' width='400' align='center'><img src='$large' alt=''></td></tr> <tr><td><img src='gallery/icons/arrow-blue-rounded-left.jpg' alt='Previous'></td><td></td><td align='right'><img src='gallery/icons/arrow-blue-rounded-right.jpg' alt='Next'> </td></tr><tr><td height='50'></td></tr>"; if ($handle = opendir("$dir")) { while (false !== ($file = readdir($handle))) { $file=$dir.$file; if (is_file($file)){ if (strpos($file,'_th.jpg')){ ++$act; if ($act > $columns) { echo "</tr><tr><td width='160' height='120' align='center'><a href='?album=$album&thumb=$file'><img src='".$file."' alt='".$file."'/></a></td>"; $act = 1; } else { echo "<td width='160' height='120' align='center'><a href='?album=$album&thumb=$file'><img src='".$file."' alt='".$file."'/></a></td>"; } } } } } } Thanks very much to anyone having a look at this! Is there a code I can put with each of these errors so that, on error, the page reloads back to the bottom of the page? When you enter the wrong info, the page already reloads but it reloads to the top of the page. People who didnt correctly information into the webpage may not see that they're receiving an error if it doesnt scroll back down. I attempted to put the error at the to of the page but I couldnt find a good spot. I thought about doing an error message box but I'm not sure thats the best method Anyway heres the code, thanks a lot. <?php if ($_POST['send']) { $errors = array(); if ($_POST['captcha'] != $_SESSION['captchacode']) { $errors[] = "You didn't enter the correct letters!"; <-------------ID LIKE TO PUT A CODE HERE AND } if (empty($_POST['email'])) { $errors[] = "Please enter an e-mail address"; <-----------------HERE TO MAKE THE PAGE GO TO THE BOTTOM WHEN IT REFRESHED (IT REFRESHES UPON EVERY IMPROPERLY FILLED OUT FORM } else if (!eregi("^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$", $_POST['email'])) { $errors[] = 'Please enter a VALID e-mail address'; } if (!count($errors)) { // IMPORTANT: If you don't call this the // user will keep getting the SAME code! captchaDone(); I have made a website with a custom scroll bar and a back to top button. For some reason the back to top button doesn't show up. Code is below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Adding a dynamic "Back To Top" floating button with smooth scroll</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<style>
/* For the "inset" look only */
html {
overflow: auto;
}
body {
position: absolute;
top: 8px;
left: 8px;
bottom: 8px;
right: 1px;
padding: 10px;
overflow-y: scroll;
overflow-x: hidden;
}
/* Width of bar */
::-webkit-scrollbar {
width: 8px;
}
/* Track */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255,0,0,0.8);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,0.4);
}
</style>
<style>
div#page {
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 20px;
}
.back-to-top {
position: fixed;
bottom: 1em;
right: 0.5em;
text-decoration: none;
color: #000000;
background-color: rgba(235, 235, 235, 0.80);
font-size: 12px;
padding: 0.8em;
display: none;
}
.back-to-top:hover {
background-color: rgba(135, 135, 135, 0.50);
}
</style>
</head>
<body>
<div id="page">
<!-- [banner] -->
<header id="banner">
<hgroup>
<h1>Adding a dynamic "Back To Top" floating button with smooth scroll</h1>
</hgroup>
</header>
<!-- [content] -->
<section id="content">
<h1>The first heading</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut nec felis sed velit auctor luctus id quis arcu. Ut dui augue, euismod nec justo a, pretium consequat nisi. Vivamus dictum nec quam in sollicitudin. Nullam non augue at risus condimentum consequat eu ut sem. Ut quis tortor quam. Nulla ullamcorper in metus egestas sagittis. In rhoncus feugiat sagittis. Cras eu arcu dui. Nulla non urna varius, facilisis sapien quis, tristique urna.
</p>
<h2>The first sub-heading</h2>
<p>
Duis tincidunt eleifend felis ac porttitor. Aenean facilisis elit eget orci vulputate scelerisque. Nulla justo sem, fringilla nec gravida vel, sollicitudin vitae libero. Donec vitae consequat lorem. Cras eros nunc, varius id dictum sit amet, posuere quis augue. Vivamus quis ipsum eget lectus porta vestibulum. Sed malesuada id orci eu rhoncus. Proin eleifend lacus non libero facilisis interdum.
</p>
<h2>The second sub-heading</h2>
<p>
Nulla luctus lorem et justo posuere, vitae ornare elit accumsan. Donec semper tincidunt lacus ut sagittis. Donec nec adipiscing nunc, quis rutrum tortor. Vivamus aliquam orci nulla, non ornare mauris eleifend et. Aliquam erat volutpat. Phasellus id nunc sapien. Suspendisse luctus pharetra lorem, quis scelerisque eros ultricies in. Vivamus hendrerit fermentum justo eget sagittis. Pellentesque cursus at turpis id cursus. Pellentesque sed rhoncus enim. Nam et ante feugiat, luctus enim in, tincidunt lectus. In feugiat neque quam. Curabitur mi ante, dictum non aliquam placerat, suscipit sed sem. Integer dictum, nulla vitae accumsan dignissim, augue justo laoreet diam, quis semper lectus orci vel mi.
</p>
<h3>The first sub-sub-heading</h3>
<p>
Vestibulum mollis elementum libero a blandit. Fusce placerat odio quis euismod elementum. Maecenas rhoncus quam viverra odio fringilla blandit. Curabitur erat mi, malesuada ac tempor eu, tincidunt vitae erat. Nunc consequat faucibus feugiat. Integer ornare dui metus, sed consectetur erat vulputate a. Sed porttitor eu magna in aliquet. Cras quis tempus lacus, ac fermentum lorem.
</p>
<h1>The second heading</h1>
<p>
Nullam dignissim nibh ac eros iaculis, quis aliquam nibh lacinia. Donec et ullamcorper nunc. Sed convallis aliquet ullamcorper. Donec non leo enim. Ut orci ante, viverra fringilla lorem nec, pretium volutpat lorem. Phasellus elit arcu, posuere at nibh at, facilisis adipiscing dolor. Duis hendrerit metus at turpis congue ornare. Aliquam orci nisi, malesuada at adipiscing non, pharetra a lectus. Mauris in rhoncus ipsum, et sagittis nulla. Duis laoreet luctus lorem, at malesuada sem bibendum at. Pellentesque ultrices massa eget lacus tempus, id ornare lacus fermentum. Sed id fermentum tellus. Suspendisse tincidunt posuere arcu quis fermentum.
</p>
<h2>The third sub-heading</h2>
<p>
Phasellus vitae lacinia sapien. Nam eget congue lorem. Donec viverra tortor eget tellus iaculis interdum. Vivamus sollicitudin egestas auctor. Vivamus sit amet justo sit amet eros sodales egestas. Nulla nec pharetra metus. Integer rutrum, ipsum in dignissim scelerisque, arcu est adipiscing tortor, nec varius eros mauris vel augue. In condimentum lobortis eros, sed facilisis neque imperdiet vel. Nullam ut commodo lectus, a luctus mi. Aliquam varius quis tortor a interdum. Aliquam erat volutpat. Nam pellentesque augue enim, eget posuere mi ultrices sodales. Vivamus vel varius quam. Donec sed ante placerat sapien consequat facilisis. Fusce vestibulum ipsum urna, nec tincidunt lacus hendrerit quis. Donec ornare dignissim risus.
</p>
<h2>The fourth sub-heading</h2>
<p>
Ut mauris mauris, porta bibendum dictum id, porttitor eu odio. Nam posuere in dui vitae pellentesque. Praesent commodo eros mattis posuere hendrerit. Suspendisse felis tellus, laoreet vitae erat non, laoreet gravida quam. Phasellus a augue non leo venenatis tempus. Curabitur ornare purus a mollis vulputate. Quisque vulputate euismod enim sed elementum. Duis id urna iaculis felis consequat vulputate. Mauris sollicitudin, leo eu sollicitudin porttitor, purus lacus sodales ipsum, vitae lobortis velit libero at libero.
</p>
<h1>The third heading</h1>
<p>
Quisque iaculis magna ac risus posuere ultricies. Sed tincidunt, sem ac pellentesque fringilla, sapien purus sagittis odio, eget aliquam ante lorem ac risus. In euismod dignissim leo ut eleifend. Proin accumsan velit quam. Phasellus sollicitudin nulla ligula, sit amet mollis lectus pellentesque consectetur. Nunc non dictum ante, fringilla lobortis nulla. Nullam ullamcorper volutpat velit, ut laoreet justo pellentesque ornare. Praesent aliquet eros eu magna sodales, ac pharetra erat dignissim. Nulla pulvinar neque at fermentum eleifend.
</p>
<h2>The fifth sub-heading</h2>
<p>
Praesent dictum interdum condimentum. Suspendisse in tortor blandit, lobortis libero eu, cursus libero. Donec vulputate ligula sit amet arcu porta imperdiet. Nam sodales, justo eu eleifend placerat, dui eros suscipit mi, quis congue dolor velit vitae nisi. Pellentesque mollis felis est. Etiam vitae justo laoreet, rutrum felis sed, porttitor dui. Sed cursus tincidunt turpis. Maecenas gravida commodo urna eget hendrerit. Ut suscipit mi sit amet turpis euismod, luctus suscipit turpis egestas.
</p>
<h1>The fourth heading</h1>
<p>
Mauris malesuada eros ac nisl pretium, at vehicula sem porttitor. Vestibulum porta erat leo, nec posuere enim pellentesque vel. Praesent libero est, laoreet quis scelerisque nec, egestas vel enim. Vivamus quis vulputate sapien. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus consequat ligula lectus, sed fermentum elit auctor vitae. Duis iaculis sagittis est sit amet semper. Morbi rutrum fermentum vulputate. Proin tincidunt elementum sem, a faucibus dui malesuada sit amet. Vivamus vel enim laoreet, iaculis nunc ac, tristique nisl. Nulla consequat arcu et dolor porta, non ullamcorper augue pharetra. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer sed nibh lectus. Sed pulvinar nunc magna, eget placerat mi pharetra ac. Vestibulum hendrerit, nulla nec vestibulum aliquam, arcu tortor blandit ipsum, eget sollicitudin nulla tellus quis libero. Duis sodales fringilla lacus vel auctor.
</p>
<h2>The sixth sub-heading</h2>
<p>
Vivamus erat turpis, condimentum vitae neque sit amet, tincidunt malesuada odio. Mauris mollis ante vitae quam condimentum lobortis. Integer sodales odio sit amet metus tempus, vel dignissim libero sagittis. Suspendisse ornare libero elit, quis sollicitudin leo pellentesque id. Sed pharetra mattis sapien nec condimentum. Mauris convallis arcu eget massa fringilla, nec pellentesque dolor semper. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum vitae odio a sem iaculis tempor. Fusce placerat viverra lorem mollis fermentum. Sed porta sit amet sapien eu venenatis.
</p>
<h3>The second sub-sub-heading</h3>
<p>
Aenean ut ipsum ultrices, sollicitudin massa quis, bibendum magna. Sed id porttitor diam, et vestibulum tortor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus vel magna dolor. Etiam cursus nibh ligula, id vestibulum metus varius feugiat. Etiam vitae dolor ligula. Aliquam eu consectetur lorem. Quisque nulla nulla, facilisis semper laoreet non, eleifend in dolor.
</p>
<a href="#" class="back-to-top"><span class="glyphicon glyphicon-chevron-up"></span></a>
</section>
<script>
jQuery(document).ready(function() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
})
});
</script>
</div>
<!-- [/page] -->
<script src="//code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Hi guys, In an application I'm working on, I'm looking to embed a youtube video with [YOUTUBE][/YOUTUBE]. Code: [Select] echo preg_replace('#(?:<\>]+href=\")?(?:http://)?((?:[a-zA-Z]{1,4}\.)?youtube.com/(?:watch)?\?v=(.{11}?))[^"]*(?:\"[^\<\>]*>)?([^\<\>]*)(?:)?#', '<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/'.$matches[2].'"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/'.$matches[2].'" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object>', $ENTIREPAGE?); The problem is that the video appears with a slider control at the bottom. How do I get rid of the Youtube slider control at the bottom? Thanks. This topic has been moved to JavaScript Help. http://www.phpfreaks.com/forums/index.php?topic=349588.0 Hi,I used bootstrap to create a webpage and one of the special effects is when you scroll down the page the section you are at is highlighted in the menu. This seems to work ok for all of my sections except the About Me section in which case the next section down (resume) is highlighted instead.
Here is the specific area on the page (http://www.inspired-...p#section-about).
I was wondering if anyone familiar with Boostrap and the Amoeba theme had any suggestions on a fix for this.
thanks in advance.
As mention in my title, I am using wordpress, bought a theme and the support team is not able to assist me without the FTP access.
URL: http://www.icv.solutions/swagger
Mobile: Android 4.4.2
Chrome: version 39.0.2171.93
Safari: star safari version 1.1
I am not able to scroll only on the above browser, other browser like firefox and default internet explorer on mobile have no such issue.
In fact the older version of chrome have no such issue too,
If anyone could give me a hint where might the problem lies at or any help at all, would be great.
I have been struggling with this for awhile now.
Thanks and happy holiday!
This topic has been moved to JavaScript Help. http://www.phpfreaks.com/forums/index.php?topic=345046.0 |
|||||||