如果用户将光标移动到块#mouse-pointer之外,它将在菜单和其他div下消失。只有当光标位于id为#mouse-pointer的块内时才想让图像跟随光标。
$(function (){
$(window).mousemove(function(event) {
$('#mouse-pointer').css({
'top' : event.pageY -100 + 'px',
'left' : event.pageX -100 + 'px'
});
});
});
HTML
<style>
#my-container{
position: relative;
width:100vw;
height: 600px;
overflow-x: hidden !important;
overflow-y: hidden !important;
cursor: none;
}
</style>
<div id="my-container">
<div id="lg-top-image" data-src="img/image_above.jpg"></div>
<div id="lg-bottom-image" data-src="img/image_below.jpg"></div>
<figure id="mouse-pointer"></figure>
</div>
答案 0 :(得分:2)
如果您希望事件仅从某个元素触发,则不应在窗口中添加事件侦听器。这样做:
<?php
// src/bamboo/tiseBundle/Twig/QRExtension.php
namespace bamboo\tiseBundle\Twig;
use Symfony\Component\HttpFoundation\Request;
class QRExtension extends \Twig_Extension
{
/**
* @var EntityManager
*/
protected $em;
public function __construct($em)
{
$this->em = $em;
}
public function getFilters()
{
return array(
new \Twig_SimpleFilter('price', array($this, 'priceFilter')),
);
}
public function getFunctions() {
return array(
'getFieldValue' => new \Twig_Function_Method($this, 'getFieldValue'),
'getGallery' => new \Twig_Function_Method($this, 'getGallery'),
'getType' => new \Twig_Function_Method($this, 'getType'),
);
}
public function getFieldValue($serial, $categoryId) {
return $this->em->getRepository('Webbamboo\tiseBundle\Entity\Him'.$categoryId)->findOneBySerialno($serial);
}
public function priceFilter($number, $decimals = 0, $decPoint = '.', $thousandsSep = ',')
{
$price = number_format($number, $decimals, $decPoint, $thousandsSep);
$price = '$'.$price;
return $price;
}
public function getGallery($categoryData)
{
$galleryKeys = array_values(array_filter(
array_keys($categoryData),
function($k) {
if(strpos($k, 'him_gallery') === false)
{
return false;
}
return true;
}
));
$youtubeKeys = array_values(array_filter(
array_keys($categoryData),
function($k) {
if(strpos($k, 'him_youtubevideo') === false)
{
return false;
}
return true;
}
));
$videoKeys = array('him_video');
return array(
'gallerykeys' => $galleryKeys,
'youtubekeys' => $youtubeKeys,
'videokeys' => $videoKeys,
);
}
public function getType($fieldName, $categoryData, $categoryName, $serial, $useragent)
{
if(strpos($useragent, 'iPhone') !== false)
{
$mobileAction = 'callto:';
}
elseif(strpos($useragent, 'Android') !== false || strpos($useragent, 'silly') !== false)
{
$mobileAction = 'wtai://wp/mc;';
}
else
{
$mobileAction = 'tel:';
}
$link = array(
'him_email' => $this->getTypeProperties('mailto:', $categoryData[$fieldName], 'fa-envelope', 'Email', 'email'),
'him_xbox' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-gamepad', 'xBox', 'xbox'),
'him_stumbleupon' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-stumbleupon', 'StumbleUpon', 'stumbleupon'),
'him_tripadvisor' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-tripadvisor', 'Tripadvisor', 'tripadvisor'),
'him_instagram' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-instagram', 'Instagram', 'instragram'),
'him_instragram' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-instagram', 'Instagram', 'instragram'),
'him_onlinebooking' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-bookmark', 'Online Booking', 'onlinebook'),
'him_website' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-home', 'Website', 'website'),
'him_gform' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-users', 'Your Thoughts', 'gform'),
'him_trustatrader' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-check-circle', 'Trust A Trader', 'trusta'),
'him_twitter' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-twitter', 'Twitter', 'twitter'),
'him_facebook' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-facebook', 'Facebook', 'facebook'),
'him_youtube' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-youtube', 'YouTube', 'youtube'),
'him_pinterest' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-pinterest-p', 'Pinterest', 'pinterest'),
'him_google' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-google-plus', 'Google', 'google'),
'him_linkedin' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-linkedin', 'LinkedIn', 'linkedin'),
'him_trusted' => $this->getTypeProperties('', $categoryData[$fieldName], 'fa-check-circle', 'Trusted Trader', 'trusted'),
'him_justgiving' => $this->getTypeProperties('', $categoryData[$fieldName], 'icon fa-custom-justgiving', 'Just Giving', 'justgiving'),
'him_bebo' => $this->getTypeProperties('', $categoryData[$fieldName], '', 'Bebo', 'bebo'),
'him_myspace' => $this->getTypeProperties('', $categoryData[$fieldName], 'icon fa-custom-myspace', 'MySpace', 'myspace'),
'him_vehiclepx' => $this->getTypeProperties('', '#/pxvalue', 'fa-info', 'PX Value', 'vehiclepx', false),
'him_price' => $this->getTypeProperties('', '#/vehicledetails', 'fa-list', 'View Details', $this->getRandomColor(), false),
'him_vehicledetails' => $this->getTypeProperties('', '#/vehicledetails', 'fa-list', 'View Details', $this->getRandomColor(), false),
'him_details' => $this->getTypeProperties('', '#/details', 'fa-list', 'View Details', $this->getRandomColor(), false),
'him_address' => $this->getTypeProperties('', 'https://maps.google.co.uk/maps?q='.$categoryData[$fieldName], 'fa-map-marker', 'Address', 'address', true),
'him_map' => $this->getTypeProperties('', 'https://maps.google.co.uk/maps?q='.$categoryData[$fieldName], 'fa-map-marker', 'Find us', 'address', true),
'him_callback' => $this->getTypeProperties('mailto:', $categoryData['him_emailaddress'].'?subject=Request Callback&body=Please call me back regarding your advertised '.$categoryName.'( '.$serial.' ), My telephone number is --------', 'fa-phone', 'Request Callback', 'callback', true),
'him_testdrive' => $this->getTypeProperties('mailto:', $categoryData['him_emailaddress'].'?subject=Request Test Drive&body=Please call me to arrange a test drive in your advertised vehicle '.$categoryName.'( '.$serial.' ), My telephone number is --------', 'fa-car', 'Request Callback', 'testdrive', true),
'him_tel' => $this->getTypeProperties($mobileAction, $categoryData[$fieldName], 'fa-phone', 'Tel', 'tel', true),
'him_mobile' => $this->getTypeProperties($mobileAction, $categoryData[$fieldName], 'fa-mobile', 'Mobile', 'mobile', true),
'him_htel' => $this->getTypeProperties($mobileAction, $categoryData[$fieldName], 'fa-phone', 'Home Tel', 'htel', true),
'him_calltobook' => $this->getTypeProperties($mobileAction, $categoryData[$fieldName], 'fa-phone-square', 'Call To Book', 'calltobook', true),
'him_smsdonate' => $this->getTypeProperties('sms:', $categoryData['him_smsdonate'].'?body='.$categoryData['him_addword'], 'fa-mobile', 'Donate £'.$categoryData['him_amount'], 'smscall', true),
);
if(isset($link[$fieldName]) && !empty($categoryData[$fieldName]))
{
if($fieldName == 'him_vehicledetails' && isset($categoryData['him_price']) && @!empty($categoryData['him_price']))
{
return false;
}
return $link[$fieldName] + array('type' => 'link');
}
elseif($fieldName == 'him_paypal_item_name')
{
//var_dump($fieldname);
return array(
'type' => 'paypal_pay',
'business' => $categoryData['him_emailaddress'],
'item_name' => $categoryData['him_paypal_item_name'],
'item_number' => $categoryData['him_paypal_item_id'],
'amount' => $categoryData['him_paypal_price'],
'currency' => $categoryData['him_currency'],
'tax_rate' => $categoryData['him_taxrate'],
'shipping' => $categoryData['him_shipping'],
'icon' => 'fa-cc-paypal',
'color' => 'paypal'
);
}
elseif($fieldName == 'him_donate')
{
//var_dump($fieldname);
return array(
'type' => 'paypal_donate',
'business' => $categoryData['him_donate'],
'item_name' => $categoryData['him_logo'],
'icon' => 'fa-cc-paypal',
'color' => 'paypal'
);
}
elseif($fieldName == 'him_skype')
{
if(strpos($useragent, 'Android') !== false || strpos($useragent, 'silly') !== false)
{
$skypeAction = 'skype:'.$categoryData['him_skypename'].'?call';
}
else
{
$skypeAction = '#';
}
return array(
'type' => 'skype',
'skypeName' => $categoryData['him_skype'],
'action' => $skypeAction,
'color' => $this->getRandomColor()
);
}
//dump($fieldName);
return false;
}
private function getRandomColor()
{
$colors = array('orange', 'lanora', 'alizarin', 'tile', 'emerald');
$rand_key = array_rand($colors, 1);
return $colors[$rand_key];
}
private function getTypeProperties($action, $value, $icon, $label, $color, $blank = true)
{
return array(
'action' => $action,
'value' => $value,
'icon' => $icon,
'label' => $label,
'color' => $color,
'blank' => $blank
);
}
public function getName()
{
return 'tise_extension';
}
}